[jQuery] Re: Opera 9 bug
Nobody got any ideas why this is happening? It seems pretty obvious
an Opera bug of some kind rather than any particular problem with
jQuery itself, but it is nonetheless very annoying. Has anyone else
encountered a problem like this or know how to work around it?
On Aug 7, 6:10 pm, Gordon [EMAIL PROTECTED] wrote:
I want to have a horizontal scrolling list of products so that a user
can compare them side by side. I produced something that works, but
discovered an extremely disconcerting problem that occured in Opera
9.x. Here is a simplified test case:
!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN http://www.w3.org/
TR/xhtml11/DTD/xhtml11.dtd
html xmlns=http://www.w3.org/1999/xhtml;
head
meta http-equiv=Content-Type content=text/html; charset=utf-8 /
titleGrid Demo/title
!--[if ie]script type=text/javascript src=/js/firebug/
firebug.js/script![endif]--
script type=text/javascript src=/js/jquery/jquery.js/script
script type=text/javascript src=/js/jquery/interface/
interface.js/script
script type=text/javascript
$(document).ready (function ()
{
var scrollStrip = $('#compScrollStrip');
$('#scrollLeft').click (function ()
{
scrollStrip.animate ({left: parseInt (scrollStrip.css
('left'), 10)
- 401}, 'slow');
});
$('#scrollRight').click (function ()
{
scrollStrip.animate ({left: parseInt (scrollStrip.css
('left'), 10)
+ 401}, 'slow');
});
});
/script
style type=text/css
!--
/* General */
body {
font: 12px Arial, Helvetica, sans-serif;
margin: 0px;
padding: 10px;
background: #F9F9F9;}
h3 {
font-size: 1em;}
/* Dialog boxes */
.dialog {
position: absolute;
z-index: 1005;
top: 50%;
left: 50%;
background-color: #FF;
border-bottom: solid 1px #9CB5CE;
border-left: solid 1px #9CB5CE;
border-right: solid 1px #9CB5CE;
opacity: 0.95;
filter: alpha (opacity=95);}
.dialog h3 {
color: #FF;
text-align: left;
background-color: #9CB5CE;
margin: 0 0 1px 0;
padding: 1px 1px 1px 5px;}
/* Comparitor dialog */
#comparitor {
width: 90%;
height: 400px;
top: 50%;
left: 50%;
margin-top: -200px;
margin-left: -45%;}
.scrollBut, #compContent {
height: 94%;
margin: 2px;}
.scrollBut {
width: 4%;
border: solid 1px black;}
#compContent {
width: 90%;
position: absolute;
left: 50%;
margin-left: -45%;
border: solid 1px black;}
#scrollLeft {
float: left;}
#scrollRight {
float: right;}
#compContent .product, #compContent .productKey {
background: #CC;
margin: 0;}
#compContent .productKey {
width: 25%;
height: 100%;
z-index: 20;
background: #0099CC;}
#compScroller {
width: 75%;
height: 100%;
position: absolute;
top: 0;
left: 25%;
overflow: hidden;
white-space: nowrap;
margin: 0;
padding: 0;
z-index: 10;}
#compScrollStrip {
position: absolute;
list-style: none;
height: 100%;
width: 4010px;
top: 0;
border: none 0px;
margin: 0;
padding: 0;
background:#00CC99;}
#compScroller .product, #compScrollStrip .product {
float: left;
height: 90%;
width: 400px;
border-left: solid 1px black;
margin: 0;
padding: 0;}
--
/style
/head
body
div class=dialog id=comparitor
h3Compare Prducts/h3
button class=scrollBut id=scrollLeft/button
div id=compContent
div class=productKeyChart key/div
div id=compScroller
ol id=compScrollStrip style=left: 0px;
li class=productItem 1/li
li class=productItem 2/li
li class=productItem 3/li
li class=productItem 4/li
li class=productItem 5/li
li class=productItem 6/li
li class=productItem 7/li
li class=productItem 8/li
li class=productItem 9/li
li class=productItem 10/li
/ol
/div
/div
button class=scrollBut id=scrollRight/button
/div
/body
/html
When performing the scroll in Opera 9, the top part of each li remains
where it is! The rest of the element scrolls though, as you can tell
by their borders moving across the display.
The bug doesn't seem to appear in opera 8.x
[jQuery] Re: jQuery Zen Garden Interface
There is a weird glitch in FF2/Mac. The left scrolling pane works properly with the mouse wheel, but the scroll bar looks like it's making content in the background scroll. The content that is supposed to scroll doesn't move when using the scroll bar. It works correctly in Safari/Mac. Otherwise, it looks good. --Erik On 8/7/07, Mitchell Waite [EMAIL PROTECTED] wrote: http://www.whatbird.com/wwwroot/Components/Complete_Search_Tab.html I called this Zen Garden because I was thinking it would be cool if there was a number of jQuery examples that demonstrated how to use the various incredible plugins that are available. This interface is an example of what a novice non programmer can do using jQuery and a number of its best plugins. The project was an inspiration to me because of how much I could accomplish with so little code. I had to become familiar with a large number of topics that are very technical, but I had a lot of hand hold and help from the community. I plan to say a lot more about what is in this page, as I believe it captures many of the best things about jQuery. Its going to grow a lot too. PS I am sure my coding and structure could be vastly improved upon. So please don't laugh too hard when you look close. *Plugin* *Description and comments* Accordion (Resig/Dan) Easing Checkboxes Tabs This was the hardest of all the plugins to get working. Match List Click on Acadian Flycatcher in the left panel of bids. It will open the overview or mini species page Mini species page Contains a summary of the bird. Green button takes you to the main species page. Sort Mode Click on Icon checkbox. Note how two buttons are disabled below it. Notice the nice visual fade effects and the way the cursor spins when the client has to wait for the server to load a page. Attribute Panel Click on the Basic attributes menu then click on Shape, Location and Size
[jQuery] Re: [Announce] charToTable plugin
thats was funny, and interesting... But seriously, we should find a better way to filter spammers... atleast something interesting and not so boring as typing some obscure letters. -GTG On 8/7/07, Robert O'Rourke [EMAIL PROTECTED] wrote: Ganeshji Marwaha wrote: By using this instead of standard images for captcha, we aren't achieving any extra usability, or are we? and it is pretty easy to decode than images anyways... so i wouldn't use'em for captcha. but it is fun nevertheless. -GTG True, just a thought anyway. Reminds me of that video on youtube: http://uk.youtube.com/watch?v=NqFOB77jLaE
[jQuery] Re: [New Plugins] Ajax Queue and Ajax Sync
I didnt find much use for these right now, but i am sure, the day won't be
far when this will save my day...
I am more interested in a plugin (or in the core itself) that will allow me
to tell jquery what an error as it applies to ajax.
At present, i guess that it is hard-coded within, which is not much useful
for handling application specific errors. And i think the error handler is
the cleanest place to handle app specific errors.
Just so you know mootools has this feature.
-GTG
On 8/7/07, John Resig [EMAIL PROTECTED] wrote:
In the source of the URL that I linked to. I also just added it to the
main contents, to make it easier to access.
--John
On 8/7/07, Christopher Jordan [EMAIL PROTECTED] wrote:
Those sound really useful! Where can we get the code?
Cheers,
Chris
On 8/7/07, John Resig [EMAIL PROTECTED] wrote:
Hey everyone -
So Mike Hostetler was telling me about some Ajax queueing plugins that
he wanted to write - so I got some ideas, and less than an hour later
- here are two new Ajax queueing plugins for you to enjoy!
Lame demo:
http://dev.jquery.com/~john/plugins/ajaxqueue/
About the plugins:
* Queued Ajax requests. A new Ajax request won't be started until the
previous queued request has finished.
Example:
jQuery.ajaxQueue({
url: test.php,
success: function(html){ jQuery(ul).append(html); }
});
* Synced Ajax requests. The Ajax request will happen as soon as you
call this method, but the callbacks (success/error/complete) won't
fire until all previous synced requests have been completed.
Example:
jQuery.ajaxSync({
url: test.php,
success: function(html){
jQuery(ul).append(b+html+/b); }
});
Both have their uses, but ajaxSync, in particular, seems quite useful.
Let me know what you think. If this code helps you out, let me know,
and I'll throw it up somewhere.
--John
--
http://cjordan.us
[jQuery] Re: [New Plugins] Ajax Queue and Ajax Sync
John Resig wrote:
Hey everyone -
So Mike Hostetler was telling me about some Ajax queueing plugins that
he wanted to write - so I got some ideas, and less than an hour later
- here are two new Ajax queueing plugins for you to enjoy!
Lame demo:
http://dev.jquery.com/~john/plugins/ajaxqueue/
About the plugins:
* Queued Ajax requests. A new Ajax request won't be started until the
previous queued request has finished.
Example:
jQuery.ajaxQueue({
url: test.php,
success: function(html){ jQuery(ul).append(html); }
});
* Synced Ajax requests. The Ajax request will happen as soon as you
call this method, but the callbacks (success/error/complete) won't
fire until all previous synced requests have been completed.
Example:
jQuery.ajaxSync({
url: test.php,
success: function(html){
jQuery(ul).append(b+html+/b); }
});
Both have their uses, but ajaxSync, in particular, seems quite useful.
Let me know what you think. If this code helps you out, let me know,
and I'll throw it up somewhere.
--John
John,
I find both plugins very useful and will most probably use them.
Synced requests are very useful for updating several parts of a page
simultanously but with still simple HTML loading, I will for sure need
this soon.
Thank you John!
Can you throw them into the repository?
--Klaus
[jQuery] Re: Nested Tables Question
Hi Mike, If you use $(table table) that will select all tables which are inside another table in the document. --rob On 8/7/07, Mike Miller [EMAIL PROTECTED] wrote: Hi, I need to find a quick way to determine whether or not table elements on the page have any children table elements...as I want to change the style class of the innermost table. Any ideas on how best to do this? M -- Rob Desbois Eml: [EMAIL PROTECTED] Tel: 01452 760631 Mob: 07946 705987 There's a whale there's a whale there's a whale fish he cried, and the whale was in full view. ...Then ooh welcome. Ahhh. Ooh mug welcome.
[jQuery] Re: tabs + jqmodal = bad things in IE6
m3avrck wrote:
Hey folks,
So I'm trying to combine the excellent jQuery tabs (www.stilbuero.de/
jquery/tabs/) with jqModal (http://dev.iceburg.net/jquery/jqModal/)
and am having a bit of trouble in IE6.
Basically, you click a button, jqModal pops up with some tabs. Easy,
you'd think, but then you get this IE6 bug:
Can't move focus to the control because it is invisible, not enabled,
or of a type that does not accept focus.
Since the jqModal window is hidden through CSS by default (before you
click) this is obviously calling the error. I tried adding in an
onLoad and onClick links but nothing seems to *render* the tabs
*after* jqModal pops up.
Not only that, but if you drag this window around using the jqDrag,
the contents of the window *mostly* disappear, except for like input
boxes, wtf???
Here is the code I am using:
$(#object)
// setup modal
.jqm({
trigger: #object-launch,
overlay:0
})
.jqDrag('h3.title')
.find(#container).tabs();
Any ideas???
Btw -- this is part of an awesome new plugin I'm hoping to announce
soon :-D Thanks!
ted
Alright,
there's a similar thing when putting google maps in popups. Try
extending the jqModal onShow function to call .tabs() on the modal
content. Once it has appeared and tabs has run you should be able to
hide and show the modal as often as you like but you might be want to
put in a check to see if tabs has already run. Let us know if you need a
hand with that.
Rob
[jQuery] Re: jQuery Zen Garden Interface
Very nice! What a great demonstration of the power of jQuery. A couple things as I was playing around: - Your Sort Modes checkboxes are acting like 2 sets of radio buttons (Text -or- Icon, FirstLast -or- LastFirst -or- Taxonomic) - With the Sound on checkbox unchecked, the sound still plays for the last three Sort Modes checkboxes (FirstLast, LastFirst, Taxonomic) and the green 3-state button - Richard On 8/8/07, Mitchell Waite [EMAIL PROTECTED] wrote: http://www.whatbird.com/wwwroot/Components/Complete_Search_Tab.html I called this Zen Garden because I was thinking it would be cool if there was a number of jQuery examples that demonstrated how to use the various incredible plugins that are available. This interface is an example of what a novice non programmer can do using jQuery and a number of its best plugins. The project was an inspiration to me because of how much I could accomplish with so little code. I had to become familiar with a large number of topics that are very technical, but I had a lot of hand hold and help from the community. I plan to say a lot more about what is in this page, as I believe it captures many of the best things about jQuery. Its going to grow a lot too. PS I am sure my coding and structure could be vastly improved upon. So please don't laugh too hard when you look close. *Plugin* *Description and comments* Accordion (Resig/Dan) Easing Checkboxes Tabs This was the hardest of all the plugins to get working. Match List Click on Acadian Flycatcher in the left panel of bids. It will open the overview or mini species page Mini species page Contains a summary of the bird. Green button takes you to the main species page. Sort Mode Click on Icon checkbox. Note how two buttons are disabled below it. Notice the nice visual fade effects and the way the cursor spins when the client has to wait for the server to load a page. Attribute Panel Click on the Basic attributes menu then click on Shape, Location and Size
[jQuery] Re: Fastest method to create table rows
Oh, it's fine. I wasn't expecting someone to write the code for me. I'm just working on a plugin and hitting a roadblock with IE here. I'm going to try and whip up an example of what I'm seeing that illustrates this outside of my project. It seems like the string operations aren't the bottleneck. The bottleneck happens when I pass a really large piece of HTML to $() to create that object in the DOM (however jQuery handles that). Once again, I'll throw together a demo that has this narrowed down to see if I get any takers. It's worth noting that this works fine in FF2,Opera, and Safari 3 Beta. It's just IE that is giving me fits. Josh On Aug 7, 10:09 pm, RobG [EMAIL PROTECTED] wrote: On Aug 8, 11:56 am, Josh Bush [EMAIL PROTECTED] wrote: Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. IE is notoriously slow if you are concatenating using the compound += operator. After all of this rambling, does anyone have any options for me to try? You might consider returning HTML from the server rather than trying stuff on the client. Sorry, for the self-dialog here. If you care to show your code that does the iteration and the data structure you are working with, you might get some takers. It seems no one is keen to write the code for you. Some questions that come to mind: - Are you trying to use innerHTML or DOM methods? - Is your data returned as a delimited string or JSON? - Are you trying to build the entire table or just add some rows? - Are there hanlders, classes, attributes or whatever that need to be added? -- Rob
[jQuery] Re: [New Plugins] Ajax Queue and Ajax Sync
On 8/8/07, John Resig [EMAIL PROTECTED] wrote:
Hey everyone -
So Mike Hostetler was telling me about some Ajax queueing plugins that
he wanted to write - so I got some ideas, and less than an hour later
- here are two new Ajax queueing plugins for you to enjoy!
Lame demo:
http://dev.jquery.com/~john/plugins/ajaxqueue/
About the plugins:
* Queued Ajax requests. A new Ajax request won't be started until the
previous queued request has finished.
Example:
jQuery.ajaxQueue({
url: test.php,
success: function(html){ jQuery(ul).append(html); }
});
* Synced Ajax requests. The Ajax request will happen as soon as you
call this method, but the callbacks (success/error/complete) won't
fire until all previous synced requests have been completed.
Example:
jQuery.ajaxSync({
url: test.php,
success: function(html){
jQuery(ul).append(b+html+/b); }
});
Both have their uses, but ajaxSync, in particular, seems quite useful.
Let me know what you think. If this code helps you out, let me know,
and I'll throw it up somewhere.
--John
Hi John,
This surely will be useful. I've been looking for ajax queue
functionality for a while but you make it simple :D
A study case where the ajax queue will be very useful is if someone is
connected to the internet behind proxy which needs authentication. If
the proxy requires user to re-authenticate after a certain period of
idle time, without ajax request queue, a lot of authentication
windows will appear because each request needs its own proxy
authentication. With queue approach, only one window will appear and
it will wait until user properly authenticates himself.
Thanks for the great idea and the great plugin.
Regards,
Mike
[jQuery] Re: Jquery can show Images from file:///C:?
No. On Aug 7, 4:28 pm, Mario Moura [EMAIL PROTECTED] wrote: Hi folks What I am trying is show an image into my browser with this tag img width=50 height=50 src=file:///C:/Users/example.JPG/ into my browser. Is it possible? or is a security lock from browsers? I am using $.post() So I could send the path that user choice C:/Users/example.JPG to my php and return img width=50 height=50 src=file:///C:/Users/example.JPG/ But isnt working because browsers cant show this tag img width=50 height=50 src=file:///C:/Users/example.JPG/ I can upload the file to webserver I know but will be more fast and I can save some bandwidth traffic if I could do this. And avoid malicious users consume my bandwidth traffic. So I am trying use AJAX to simulate Upload Ajax? and when forms is already send images normaly (without ajax). So Jquery can show Images from file:///C:? or something like this? Regards Mario
[jQuery] Re: Making periodical calls per Ajax?
Try this: http://www.jasons-toolbox.com/JHeartbeat/ On Aug 7, 9:56 pm, voltron [EMAIL PROTECTED] wrote: Howdy! how does one making periodical Ajax calls using Jquery? Thanks
[jQuery] Re: Swapping img src in IE shows blank
One suggestion, if it is not already done, is to preload the images.
On Aug 7, 11:35 am, gecko68 [EMAIL PROTECTED] wrote:
I am trying to swap an image src using jquery, and in FF it works
great, in IE6, its sometimes shows the image, and other times shows
nothing.
$('#arrow').attr(src,arrow_blue_right.gif);
Any ideas?
[jQuery] Re: BlockUI: Odd behaviour in Internet Explorer
Hi Mike,
i updated my jquery.blockUI.js with the latest one what u
present in the link. Now i used
$.ajax ({
type: 'GET',
dataType: 'xml',
url : 'foo' ,
complete: function ()
{
$.unblockUI ();
}
});
also but the progress bar is still showing incomplete.I am not able to
find out any solution for this.If the progress bar is showing in
loading state only. Please guide me on this.
Regards
Bhusan
On Jul 25, 5:43 am, Mike Alsup [EMAIL PROTECTED] wrote:
Gordon,
I really like this idea so I added it as the default behavior to
blockUI. Unblocking is now done as a fade operation in the lastest
version
(http://jqueryjs.googlecode.com/svn/trunk/plugins/blockUI/jquery.block...).
This can be overridden for anyone that doesn't like it.
I'm not seeing the IE6 problem so let me know if that still occurs.
Thanks for the idea!
Mike
On 7/24/07, Gordon [EMAIL PROTECTED] wrote:
I have been attempting to build functionality into my AJAX app that
blocks the UI while the XML is loading. At first I thought I could do
this quite simply with a DIV over the top of the content, but as it
became increasingly aparent that IE 6 wouldn't work with this approach
I went with the blockUI plugin instead.
I got it working without too much difficulty but I noticed some odd
behaviour in IE. Once the interface has been restored the IE download
progress bar is still showing and the throbber (the spinning circle in
IE 7 and the Windows logo flag in IE 6) are still animating. They do
eventually time out and there doesn't seem to be any impact of the
actual workings of my app, but the progress bar and throbber might
mislead some users into thinking the page isn't ready to use when in
fact it is.
The problem seems to have something to do on completion of the AJAX
request. When I call unblockUI () on complete the progress bar
disappears and the throbber stops. The code for doing it was along
these lines:
$.ajax ({
type: 'GET',
dataType: 'xml',
url : 'foo' ,
complete: function ()
{
$.unblockUI ();
}
});
However I found the effect a little abrupt so I thought that instead I
could do a fade out and call unblockUI in the callback, something like
the following:
$.ajax ({
type: 'GET',
dataType: 'xml',
url : 'foo' ,
complete: function ()
{
$('.blockUI').fadeOut ('slow', function (){$.unblockUI ()});
}
});
The fadeout effect happens as desired but the progress bar and
throbber still show activity.
Does anyone know if this is normal or not? Is there a way of
achieving a fade out without causing the throbber problem in IE? For
the record the other test browsers did not seem to have this problem.
I know that on the whole it's a pretty minor problem but I do still
think it might cause confusion for people.
[jQuery] Re: Jquery native HTML editor
Thanks On Aug 7, 11:08 pm, Glen Lipka [EMAIL PROTECTED] wrote: Some discussions on the topic:http://groups.google.com/group/jquery-ui/browse_thread/thread/5423ce2... Glen On 8/7/07, voltron [EMAIL PROTECTED] wrote: Hi all, I would like to know if progress has been made on the Jquery native HTML editor, can one use it production code? Where can one download and evaluate the latest version? Thanks
[jQuery] Selecting attributes of an element
Excuse my newbiness, how do I select a particular attribute of an element? Example: li test1 =foo test2=bar foobar/li how do I select and return the test1 attribute? Thanks
[jQuery] appfuse: jQuery + scriptaculous + datePicker
Hello all. I posted this over at Appfuse's Nabble list as first, but then thought this would be the better place. I have a default.jsp page that uses SiteMesh to 'decorate' all of my jsps. It contains the following js libraries: prototype.js scriptaculous.js global.js In order to use datePicker you need the following js libraries: jquery-1.x.js date.js jquery-dimensions.js jquery-datepicker.js I put those 4 js files in my test.jsp file. But when the test.jsp page is rendered, including all the stuff in default.jsp, Firefox goes berserk. I get thousands of js errors, all in effects.js: this._base has no properties, http://localhost:8080/scripts/effects.js, Line 516 This also happens if I put my jquery.js in default.jsp after scriptaculous.js. However, if I put it before scriptaculous.js I get no errors. But my calendar doesn't work! No errors, just doesn't appear! And if I comment out scriptaculous.js in default.jsp, and leave jquery.js in test.jsp, my calendar works. Oddly enough, the calendar appears in the bottom left corner of the screen and without any styles. It seems it's not grabbing either the datepicker.css or demo.css it needs, I don't know. Anyone ever used datePicker, or more generally, scriptaculous + jquery? It seems that the order you put them in your page is important. It seems like if you put jquery after scriptaculous it goes into a loop, when jquery's constructor is called, and never exits. Thanks! Bob
[jQuery] Re: Making periodical calls per Ajax?
Thanks Erik, I know about setInterval and setTimeout, I thought there was a Jquery-ish way to doe this, as in a value to set ind one of the Jquery Ajax methods in the API :-) It seems as if the jHeartBeat plugin is not maintained anymore. On Aug 7, 11:07 pm, Erik Beeson [EMAIL PROTECTED] wrote: There is a jHeartbeat plugin, but it hasn't been updated in a while, so who knows how well it works now. You might use it to get you started though. Also, you might want to look into the JavaScript functions setInterval and setTimeout. --Erik On 8/7/07, voltron [EMAIL PROTECTED] wrote: Howdy! how does one making periodical Ajax calls using Jquery? Thanks
[jQuery] [New plugin] jQuery.YAV an easy web form validation using YAV library
Hi all, I just upload of my spare times in holidays ;-) . jQuery.YAV is a new plugin with the good things of YAV library and jQuery.Validation of Jörn Zaefferer. Some features: * Rules as class names. Set a rule class name in the field and the title and it will be validated. * Functions onError and onOk for more control post-validation. * Relationships between field or group of fields (A and B) or (C and D) * Repair little bug in YAV for multivalue class attribute Documentation, examples and download: http://letmehaveblog.blogspot.com/2007/08/easy-client-side-web-forms-validations.html in jQuery plugins page: http://jquery.com/plugins/project/jquery_yav -- Best Regards, José Francisco Rives Lirola sevir1ATgmail.com SeViR CW · Computer Design http://www.sevir.org Murcia - Spain
[jQuery] Re: Fastest method to create table rows
Hi Josh, On 8/8/07, Josh Bush [EMAIL PROTECTED] wrote: Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. After all of this rambling, does anyone have any options for me to try? I'm new to both javascript and jquery (and a bit tired too ;) but have you tried to append only a few lines every time and repeat that in a loop? I'm not sure, but I think this could probably be a bit faster. :-) Sorry, for the self-dialog here. -Josh Greetings Kai
[jQuery] Re: Iframe events for local pages
Ok thanks:) it works
but I'm interested to touch less possible sample.html.
And so I have tried this in main.html:
function doBind() {
var frame=document.getElementsByTagName(iframe)
[0].contentDocument.documentElement;
$(frame).bind('click', function(event) { alert('an element in frame
is clicked ' + event.target.innerHTML) })
}
it would be a kind of addEventListener (using jquery-bind).
On firefox 2.0.x it works but I suppose it's not good for explorer
because is present 'contentDocument.documentElement'
Have you any idea to make it cross-browser???
Thanks,
Julio
[jQuery] Problem with updating lists using jQuery
What I am trying to do is this. I have an unordered list. Each item
has a link to remove the item, and above is a simple form to add a new
item.
HTML:
ul id=propertyList
li id=1a href=javascript: void(0) title=Delete
class=deletePropertyItem 1/li
li id=2a href=javascript: void(0) title=Delete
class=deletePropertyItem 2/li
/ul
jQuery Code:
i=1;
$(#addProperty).click(function()
{
// Get property values
name = $('#property_name').val();
value = $('#property_value').val();
// If both are not empty, add a property to the list
if((name != '') (value != ''))
{
$(#propertyList).prepend('li id='+i+'a href=javascript:
void(0) title=Delete class=deleteProperty'+name+value+'/
li');
i=i+1;
}
return false;
} );
// When a delete link clicked, remove that list item from list
$(a.deleteProperty,$(#propertyList li)).click(function()
{
$(this.parentNode).remove();
} );
So basicly, I have some items in the list already, now when the delete
links are clicked these are removed. But if I add a new item, none of
the jQuery code runs at all on the new item. I did a test and it seems
it don't even know any of these functions are there. Now am I being
silly or is there a real problem?
Thanks
[jQuery] Re: An open letter to non-Believers...
On Jul 11, 5:54 am, Stephan Beal [EMAIL PROTECTED] wrote: A public jQuery forum is probably not the place to address non- Believers - that is, people who do not use jQuery - but my hope is that some of the Believers here will take this and pass it on to any non-Believers who they know, to help convert the Poor Sods who are wasting their time writing code to traverse and manipulate their [X]HTML DOMs. Based on my 30+ years of software and product development, with nearly 20+ or so language coverage in my time, I come to understand that people will use the tools they are comfortable with - its that simple. I mean, there was time during my old arrogrant and snobbish days where I thought APL was the greatest language in the world and you had to be a moron if you were not able to use it. As the old saying went, if an APL programmer can't program the world in one line, he won't program at all. APL required a different mindset. For me, personally, it was very important to have complete control of my resources and a 100% grasp of the nuts and bolts. Wrappers and layers, and yet even more layers and wrappers for the previous layers and wrappers usually proved to be a waste of time, especially when things broke or it wasn't exactly how you expected, or you needed more functionality. But overall, if you don't have control of your resources, you can surely waste alot of time just as well. Consider that the language BASIC is still around for a reason. I recall the days when the next best lanuguage or popular for the time, was suppose to kill BASIC. However, what usually happen over and over again is that as the machines got faster and fast, the interpretative languages such as BASIC became more useable, even more popular. I would venture that JAVASCRIPT falls in this category - the speed of the today hardware have many languages like JavasScript, and the affordablity to add layer after layers on that of JS, practical and feasible. Just as yourself does it pay to compile it? We have one of the original Online Hosting systems in the market - BBS systems, some might call them today Online communitys and social networks. Ours system was one of the first integrated application servers with a pcode-server side language called wcBASIC. BASIC was selected back in the 80s for marketing reasons - EVERYONE knew it. But today, there isn't a day that doesn't go by where don't consider using a interpretatve, not compiled server-side language. Using Javsascript on the server-side may be practical. Not sure. We would like to explore that. We had one of the PHP authors working for us, and sometimes I think it was mistake not giving him the freedom to use his PHP work for our system instead of WCBASIC. I can say that in hindsight, but back then Open Source was still something that bothered us - everything we did was interrnal, no dependencies, plus, how can you compare pcode compile server side applets to a slower PHP interpreative environment which in reality did yield slower page rendering. Plus, and you might related to this with your SpiderApe work, wcBASIC was a multidevice system and included template technology that allowed console development as well - an important part of a BBS system. To help put this in context a bit, i want to lay my credentials out on the table, so that nobody will think that this letter is coming from a noob script-kiddie. My first line of code (in BASIC, no less) was pounded out on Christmas day of 1983. Since that day my life has more or less been centered around computing. Since 1994 i have worked professionally with computers, and since over 10 years i've earned my daily bread by programming in a variety of languages, such as Java, C+ + and PHP. i run a couple of Open Source projects, such ashttp://toc.sf.net,http://SpiderApe.sf.net, and, my personal favourite,http://s11n.net. i also write technical papers from time to time (http:// wanderinghorse.net/computing/papers/). Very impressive work you are doing with SpiderApe. :-) When i first caught wind of jQuery, the name made it sound like an SQL library for Java. Now that you mention it, I too do seem to recall thinking SQL when I saw a reference to JQuery somewhere. On the home page of jquery.com we are immediately faced with the second arch-enemy of programmers everywhere: a Statement of Hype. It speaks thusly: You start with 10 lines of jQuery that would have been 20 lines of tedious DOM JavaScript. By the time you are done it's down to two or three lines and it couldn't get any shorter unless it read your mind. - Dave Methvin The Layer over layer syndrom. :-) Honestly, it all depends, layers are suppose to simplify things, making it easier for programmers to cover ideas with less coding. You still need a basic understanding of what it your are wrapping, and also understand when things do not react as you expecting. However, once it becomes its own complex monster, it
[jQuery] Known Opera javascript bugs list
Does anyone know if there is a list of known JavaScript bugs for Opera 8? I did a significant rewrite of a section of code recently for a speedup. The speedup I got was pretty massive, especially so in IE, and it works in all my test browsers (IE6 and 7, Firefox 1.5, Safari 3 beta and Opera 9), but it causes a massive crash in Opera 8. I was originally doing a $.each on an object but when I discovered that doing return (false) doesn't seem to break you out of a loop like the documentation claims it will I changed to using for (bar in foo) iterators instead and breaking to a label outside the loop to terminate the loop early. I suspect this might be what's causing he opera 8 crash but I have no way to be sure, or how to work around it if it is the case, or how to determine what the real issue is and what do do about it if it is not the case.
[jQuery] Re: appfuse: jQuery + scriptaculous + datePicker
Hi, Have you seen this page? http://docs.jquery.com/Using_jQuery_with_Other_Libraries Hope it helps, Kelvin :) syg6 wrote: Hello all. I posted this over at Appfuse's Nabble list as first, but then thought this would be the better place. I have a default.jsp page that uses SiteMesh to 'decorate' all of my jsps. It contains the following js libraries: prototype.js scriptaculous.js global.js In order to use datePicker you need the following js libraries: jquery-1.x.js date.js jquery-dimensions.js jquery-datepicker.js I put those 4 js files in my test.jsp file. But when the test.jsp page is rendered, including all the stuff in default.jsp, Firefox goes berserk. I get thousands of js errors, all in effects.js: this._base has no properties, http://localhost:8080/scripts/effects.js, Line 516 This also happens if I put my jquery.js in default.jsp after scriptaculous.js. However, if I put it before scriptaculous.js I get no errors. But my calendar doesn't work! No errors, just doesn't appear! And if I comment out scriptaculous.js in default.jsp, and leave jquery.js in test.jsp, my calendar works. Oddly enough, the calendar appears in the bottom left corner of the screen and without any styles. It seems it's not grabbing either the datepicker.css or demo.css it needs, I don't know. Anyone ever used datePicker, or more generally, scriptaculous + jquery? It seems that the order you put them in your page is important. It seems like if you put jquery after scriptaculous it goes into a loop, when jquery's constructor is called, and never exits. Thanks! Bob
[jQuery] Re: appfuse: jQuery + scriptaculous + datePicker
syg6 wrote: Hello all. I posted this over at Appfuse's Nabble list as first, but then thought this would be the better place. I have a default.jsp page that uses SiteMesh to 'decorate' all of my jsps. It contains the following js libraries: prototype.js scriptaculous.js global.js In order to use datePicker you need the following js libraries: jquery-1.x.js date.js jquery-dimensions.js jquery-datepicker.js I put those 4 js files in my test.jsp file. But when the test.jsp page is rendered, including all the stuff in default.jsp, Firefox goes berserk. I get thousands of js errors, all in effects.js: this._base has no properties, http://localhost:8080/scripts/effects.js, Line 516 This also happens if I put my jquery.js in default.jsp after scriptaculous.js. However, if I put it before scriptaculous.js I get no errors. But my calendar doesn't work! No errors, just doesn't appear! And if I comment out scriptaculous.js in default.jsp, and leave jquery.js in test.jsp, my calendar works. Oddly enough, the calendar appears in the bottom left corner of the screen and without any styles. It seems it's not grabbing either the datepicker.css or demo.css it needs, I don't know. Anyone ever used datePicker, or more generally, scriptaculous + jquery? It seems that the order you put them in your page is important. It seems like if you put jquery after scriptaculous it goes into a loop, when jquery's constructor is called, and never exits. Thanks! Bob This should help you: http://docs.jquery.com/Using_jQuery_with_Other_Libraries --Klaus
[jQuery] Re: Iframe events for local pages
I solved with this:
function doBind() {
var frame;
if ($.browser.msie) {
frame = document.frames[0].document;
} else {
frame = document.getElementsByTagName(iframe)
[0].contentDocument.documentElement;
}
$(frame).bind('click', function(event) { alert('an element in frame
is clicked ' + event.target.innerHTML) })
}
Is there a wrap of jquery for above if/else? Or more generic
question, is there a wrap to get a iframe/frame in jquery?
I'm searching in jquery docs but I have not found anything again
On Aug 8, 10:32 am, julio [EMAIL PROTECTED] wrote:
Ok thanks:) it works
but I'm interested to touch less possible sample.html.
And so I have tried this in main.html:
function doBind() {
var frame=document.getElementsByTagName(iframe)
[0].contentDocument.documentElement;
$(frame).bind('click', function(event) { alert('an element in frame
is clicked ' + event.target.innerHTML) })
}
it would be a kind of addEventListener (using jquery-bind).
On firefox 2.0.x it works but I suppose it's not good for explorer
because is present 'contentDocument.documentElement'
Have you any idea to make it cross-browser???
Thanks,
Julio
[jQuery] Re: Fastest method to create table rows
From the sound of it, you're receiving data back from the server,
generating html, then passing that html to .append() right? I'd try
using standard dom methods (i.e. document.createElement('td')), and
avoid converting the strings at all.
When jQuery converts an html string, it does a bunch of munging (have a
look at the jquery.clean function) to make sure that the elements you
get back match the elements you put in. Most of the munging is to get
rid of extra elements IE adds to tables, so it's much, much faster
(especially for tables) to just start with a DOM node in the first place
if at all possible.
Cheers,
Luke
Josh Bush wrote:
Well, I feel stupid. it's not the join that's taking so long, it's
the $( really big DOM string with 1,000 rows and 3 columns) that
takes so dang long on IE7. After all of this rambling, does anyone
have any options for me to try?
Sorry, for the self-dialog here.
-Josh
On Aug 7, 8:42 pm, Josh Bush [EMAIL PROTECTED] wrote:
Well, FF2 performance is great at 500-600ms. IE7 is struggling with a
join of 1,000 elements to the tune of 70,000 ms!
Each array element contains a string, something like 'trtd1/
tdtd2/td/tr'
Any advice is greatly appreciated. I still feel like a noob in
javascript sometimes. :(
Josh
On Aug 7, 3:40 pm, Josh Bush [EMAIL PROTECTED] wrote:
I'm working on a project that makes a web service call and pulls back
data. Sometimes that data can be 1,000ish rows. What is the fastest
way that I can create those rows? Right now I'm just doing string
concatenation to make HTML and passing that to the .append method. I
read the other day where someone(Klaus?) said that array.join was a
faster way to do string concatenation.
I'd like to avoid the string concats all together if there is a faster
method. I'm just poking around for ideas.
Thanks
Josh
[jQuery] Re: Fastest method to create table rows
Hi Josh, Not answering the question, but does your app really require 1000+ table rows to be displayed at once? Would some pagination not be more appropriate? This wouldn't just help the speed of the build, but it'd also really help the poor person that otherwise has to scroll through 1000 rows. yours unhelpfully, Rich Wild. On Aug 8, 11:52 am, Josh Bush [EMAIL PROTECTED] wrote: Oh, it's fine. I wasn't expecting someone to write the code for me. I'm just working on a plugin and hitting a roadblock with IE here. I'm going to try and whip up an example of what I'm seeing that illustrates this outside of my project. It seems like the string operations aren't the bottleneck. The bottleneck happens when I pass a really large piece of HTML to $() to create that object in the DOM (however jQuery handles that). Once again, I'll throw together a demo that has this narrowed down to see if I get any takers. It's worth noting that this works fine in FF2,Opera, and Safari 3 Beta. It's just IE that is giving me fits. Josh On Aug 7, 10:09 pm, RobG [EMAIL PROTECTED] wrote: On Aug 8, 11:56 am, Josh Bush [EMAIL PROTECTED] wrote: Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. IE is notoriously slow if you are concatenating using the compound += operator. After all of this rambling, does anyone have any options for me to try? You might consider returning HTML from the server rather than trying stuff on the client. Sorry, for the self-dialog here. If you care to show your code that does the iteration and the data structure you are working with, you might get some takers. It seems no one is keen to write the code for you. Some questions that come to mind: - Are you trying to use innerHTML or DOM methods? - Is your data returned as a delimited string or JSON? - Are you trying to build the entire table or just add some rows? - Are there hanlders, classes, attributes or whatever that need to be added? -- Rob
[jQuery] Re: Fastest method to create table rows
Okay, I slapped together a test. It's up at http://digitalbush.com/tests/speed_woes.html The big deal is how long it takes for the jQuery object to get created on IE7 vs any other browser. I haven't tried IE6 and lower, but I have tried FF2, Safari 3 Beta, and Opera. Thank You Josh On Aug 7, 10:09 pm, RobG [EMAIL PROTECTED] wrote: On Aug 8, 11:56 am, Josh Bush [EMAIL PROTECTED] wrote: Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. IE is notoriously slow if you are concatenating using the compound += operator. After all of this rambling, does anyone have any options for me to try? You might consider returning HTML from the server rather than trying stuff on the client. Sorry, for the self-dialog here. If you care to show your code that does the iteration and the data structure you are working with, you might get some takers. It seems no one is keen to write the code for you. Some questions that come to mind: - Are you trying to use innerHTML or DOM methods? - Is your data returned as a delimited string or JSON? - Are you trying to build the entire table or just add some rows? - Are there hanlders, classes, attributes or whatever that need to be added? -- Rob
[jQuery] Re: Problem with updating lists using jQuery
On 8/8/07, Adam [EMAIL PROTECTED] wrote:
// When a delete link clicked, remove that list item from list
$(a.deleteProperty,$(#propertyList li)).click(function()
{
$(this.parentNode).remove();
} );
This code runs once and attaches the click handler above to the existing
a.deleteProperty elements. The new DOM elements you're adding never get this
event binding. Check this FAQ entry for more info and two possible
solutions:
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_Ajax_request.3F
- Richard
[jQuery] Opera-friendly way of deleting the members of an object
I think I found the problem.
I had an object I was using to store a list of elements that was being
shared between a number of other objects. Before doing a loop to
determine what I needed to include in the object I'd clear out the old
values. At first I was doing it like this:
foo = {};
but I discovered this led to a problem. Because there was two
references to the original object, the second reference would still
point to the old object and the old values.
I thought I could work around this problem by simply maintaining the
object and deleting all its members, like this:
for (var bar in foo)
{
delete (foo [bar]);
}
This appears to be what's causing Opera 8 to crash. Opera 9 and the
other browsers handle it without problem.
Is there a way to delete all the members of an object without actually
destroying the object itself and that will work in Opera 8?
On Aug 8, 12:06 pm, Gordon [EMAIL PROTECTED] wrote:
Does anyone know if there is a list of known JavaScript bugs for Opera
8? I did a significant rewrite of a section of code recently for a
speedup. The speedup I got was pretty massive, especially so in IE,
and it works in all my test browsers (IE6 and 7, Firefox 1.5, Safari 3
beta and Opera 9), but it causes a massive crash in Opera 8.
I was originally doing a $.each on an object but when I discovered
that doing return (false) doesn't seem to break you out of a loop like
the documentation claims it will I changed to using for (bar in foo)
iterators instead and breaking to a label outside the loop to
terminate the loop early. I suspect this might be what's causing he
opera 8 crash but I have no way to be sure, or how to work around it
if it is the case, or how to determine what the real issue is and what
do do about it if it is not the case.
[jQuery] Re: Selecting attributes of an element
On 8/8/07, voltron [EMAIL PROTECTED] wrote:
Excuse my newbiness, how do I select a particular attribute of an
element?
Example:
li test1 =foo test2=bar foobar/li
how do I select and return the test1 attribute?
var test1val = $(li).attr('test1');
alert(test1val == foo);
See http://docs.jquery.com/DOM/Attributes#attr.28_name_.29
- Richard
[jQuery] Re: Draggable - change revert after start and before stop
My guess would be that the code you've tried doesn't work because it is more
akin to creating a new Draggable, not modifying the existing one. I don't
know that Interface Draggables has any support for what you're trying to do.
As it is in maintenance mode (bug fixes only) and new development is
happening in UI.Draggables, I would suggest sending this as a feature
request to [EMAIL PROTECTED] It's currently under development with
a release scheduled for Sep. 3rd. More info:
http://docs.jquery.com/UI
http://docs.jquery.com/UI/Roadmap
- Richard
On 8/8/07, GTPilot [EMAIL PROTECTED] wrote:
If my draggable item does not reach a target, i want it to revert, so
I set revert by default.
When it hovers over a target, I want to set revert to false.
I can't make this work. I thought it would be as easy as putting the
following code in the onHover of the droppable:
$('#'+drag.id).Draggable({revert:false});
But it doesn't work. Can you change the value of revert in the middle
of a drag?
[jQuery] Re: [New Plugins] Ajax Queue and Ajax Sync
Ganeshji,
I you want control over ajax error handling you can just redefine the
jQuery.httpSuccess function. That fn simply returns a boolean. It is
currently implemented as follows:
httpSuccess: function( r ) {
try {
return !r.status location.protocol == file: ||
( r.status = 200 r.status 300 ) || r.status == 304 ||
jQuery.browser.safari r.status == undefined;
} catch(e){}
return false;
}
Mike
On 8/8/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
I didnt find much use for these right now, but i am sure, the day won't be
far when this will save my day...
I am more interested in a plugin (or in the core itself) that will allow me
to tell jquery what an error as it applies to ajax.
At present, i guess that it is hard-coded within, which is not much useful
for handling application specific errors. And i think the error handler is
the cleanest place to handle app specific errors.
Just so you know mootools has this feature.
-GTG
On 8/7/07, John Resig [EMAIL PROTECTED] wrote:
In the source of the URL that I linked to. I also just added it to the
main contents, to make it easier to access.
--John
On 8/7/07, Christopher Jordan [EMAIL PROTECTED] wrote:
Those sound really useful! Where can we get the code?
Cheers,
Chris
On 8/7/07, John Resig [EMAIL PROTECTED] wrote:
Hey everyone -
So Mike Hostetler was telling me about some Ajax queueing plugins that
he wanted to write - so I got some ideas, and less than an hour later
- here are two new Ajax queueing plugins for you to enjoy!
Lame demo:
http://dev.jquery.com/~john/plugins/ajaxqueue/
About the plugins:
* Queued Ajax requests. A new Ajax request won't be started until the
previous queued request has finished.
Example:
jQuery.ajaxQueue({
url: test.php,
success: function(html){ jQuery(ul).append(html); }
});
* Synced Ajax requests. The Ajax request will happen as soon as you
call this method, but the callbacks (success/error/complete) won't
fire until all previous synced requests have been completed.
Example:
jQuery.ajaxSync({
url: test.php,
success: function(html){
jQuery(ul).append(b+html+/b); }
});
Both have their uses, but ajaxSync, in particular, seems quite useful.
Let me know what you think. If this code helps you out, let me know,
and I'll throw it up somewhere.
--John
--
http://cjordan.us
[jQuery] Re: Form Plugin: Submitting async?
Arne, I agree with Dan that this sounds like a config issue. I have never seen the file uploads open a new tab like you describe and if you figure out why it's happening please send me a note about your findings. Just to clarify the IFrame upload logic; it is synchronous. The logic simply changes the target attribute of the form and then invokes the form's submit method which is a blocking call. The target is set to a hidden IFrame which is where the server response is written. I do use a short setTimeout before the submit so that any UI changes (like a Please Wait message) can be rendered. Also, all the expected AJAX callbacks are invoked, but these are synthetic and use a mock XHR object. Ultimately, when form.submit() is called you'll be waiting for that operation to complete. Mike On 8/7/07, Arne-Kolja Bachstein [EMAIL PROTECTED] wrote: Hi Dan, yes, exactly this is what I meant. Well, tested it in IE7 now and it works correctly, so there must really be a problem with my firefox. Well, I don't have that much plugins installed, mainly some webdev plugins like firebug, but it has to do something with my config. So thanks again for your help, I got it generally working now :-) A nice little upload progress meter with jQuery and APC (Alternative PHP Cache)! Greetings Arne -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Dan G. Switzer, II Sent: Tuesday, August 07, 2007 10:27 PM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Form Plugin: Submitting async? Arne, thanks for that fingertipp, it makes me understand its behaviour. But nonetheless there's now the question: why is this iframe not opened as an iframe but as a new tab? What can force a modern browser (Firefox 2.0.x) to open an iframe in a new tab? I'm a bit confused about that... Are you saying that when you use the Form Plug-in, the IFRAME is opened in a new tab? If so, that's got to be a Firefox Plug-in you have installed. -Dan
[jQuery] Re: Thickbox - why isn't the window centered?
Done some digging : On Aug 7, 9:08 pm, polyrhythmic [EMAIL PROTECTED] wrote: I first noticed this problem with 1.1.2 + Thickbox 3, and from my testing I believe it is a problem with the thickbox CSS, not with jQuery itself. Hmm - but if i switch back to Jquery 1.1.2 the problem is gone on my side ! But - i will be going with 1.1.3.1 because i want to implement that version. I think the secret to fixing this bug is finding why the #TB_load div centers itself properly... I agree - maybe it has something to do with the place the #TB_load is inserted into the DOM in regard to #TB_window ?!??! and finding the difference between the Demo CSS and the Release CSS (don't know why it should be different, unless the bug is somehow related to DOM tree structure.) Demo CSS and Release CSS are equal !! Odd that the demo works in IE6, I see that as well. But - demo uses jQuery 1.1.2 !! So - recap : CSS problem most likely + place where inserted into DOM . Strange thing to note at the end : on my problem page, if i view the Thickbox with page at top all is ok , but if i scroll to bottom it seems like Thickbox window is placed using the top position of the page and not of the active window ! Something to find here ?!?
[jQuery] Re: Thickbox - why isn't the window centered?
Hmm - browsing through the topic i read this at the top : On Aug 6, 9:15 pm, Andy Matthews [EMAIL PROTECTED] wrote: I have a page which contains a long listing of records. When I scroll down to the bottom, and click the thickbox trigger link, thickbox opens the modal window, but it's at the very top of the page, out of sight. So - Andy also noticed my problem of Thickbox flipping to Top of page instead of Top of Window - so there must be something in it - problem is i have to dig into the CSS expression - not quite my cup of tea.
[jQuery] Re: Draggable - change revert after start and before stop
I had done this, but now I'm using a modified version of Interface, so
I can't quite remember which parts require the modifications. Like
Richard said, creating a new Draggable is definitely not what you want
to do. I suggest you try:
$(...).Droppable({
...,
onHover: function(drag) {
drag.dragCfg.revert = false;
},
onOut: function(drag) {
drag.dragCfg.revert = true;
}
});
Or possibly:
$(...).Droppable({
...,
fx: 250,
onHover: function(drag) {
drag.dragCfg.fx = 0;
},
onOut: function(drag) {
drag.dragCfg.fx = 250;
}
});
Where 250 is the duration in milliseconds for the revert to happen.
--Erik
On 8/7/07, GTPilot [EMAIL PROTECTED] wrote:
If my draggable item does not reach a target, i want it to revert, so
I set revert by default.
When it hovers over a target, I want to set revert to false.
I can't make this work. I thought it would be as easy as putting the
following code in the onHover of the droppable:
$('#'+drag.id).Draggable({revert:false});
But it doesn't work. Can you change the value of revert in the middle
of a drag?
[jQuery] Re: Fastest method to create table rows
I totally expected this question. We've added client side filtering to aid the user in trimming that list down which is working very well for us speed wise. The case where a 1,000 row query comes back is not the norm, so for us it doesn't make sense to add the complexity (UI wise) of paging for a maybe 10% scenario. If it becomes a problem I may need to drum up some sort of dynamic load piece that adds more stuff as the user scrolls. The filtering would then need to be server side. It wouldn't be a bad way to go, but that would add more complexity (development wise) to this project with the need for caching results to keep server load down and the UI additions. The frustrating thing about it is that usability is fine in the other browsers. Thanks for keeping me on my toes Rich. Josh On Aug 8, 6:30 am, Rich Wild [EMAIL PROTECTED] wrote: Hi Josh, Not answering the question, but does your app really require 1000+ table rows to be displayed at once? Would some pagination not be more appropriate? This wouldn't just help the speed of the build, but it'd also really help the poor person that otherwise has to scroll through 1000 rows. yours unhelpfully, Rich Wild. On Aug 8, 11:52 am, Josh Bush [EMAIL PROTECTED] wrote: Oh, it's fine. I wasn't expecting someone to write the code for me. I'm just working on a plugin and hitting a roadblock with IE here. I'm going to try and whip up an example of what I'm seeing that illustrates this outside of my project. It seems like the string operations aren't the bottleneck. The bottleneck happens when I pass a really large piece of HTML to $() to create that object in the DOM (however jQuery handles that). Once again, I'll throw together a demo that has this narrowed down to see if I get any takers. It's worth noting that this works fine in FF2,Opera, and Safari 3 Beta. It's just IE that is giving me fits. Josh On Aug 7, 10:09 pm, RobG [EMAIL PROTECTED] wrote: On Aug 8, 11:56 am, Josh Bush [EMAIL PROTECTED] wrote: Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. IE is notoriously slow if you are concatenating using the compound += operator. After all of this rambling, does anyone have any options for me to try? You might consider returning HTML from the server rather than trying stuff on the client. Sorry, for the self-dialog here. If you care to show your code that does the iteration and the data structure you are working with, you might get some takers. It seems no one is keen to write the code for you. Some questions that come to mind: - Are you trying to use innerHTML or DOM methods? - Is your data returned as a delimited string or JSON? - Are you trying to build the entire table or just add some rows? - Are there hanlders, classes, attributes or whatever that need to be added? -- Rob
[jQuery] Re: Fastest method to create table rows
Do you think this would be faster all the way around across
platforms? I've never actually done any direct dom creation stuff,
so this will be new to me.
Josh
On Aug 8, 6:05 am, Luke Lutman [EMAIL PROTECTED] wrote:
From the sound of it, you're receiving data back from the server,
generating html, then passing that html to .append() right? I'd try
using standard dom methods (i.e. document.createElement('td')), and
avoid converting the strings at all.
When jQuery converts an html string, it does a bunch of munging (have a
look at the jquery.clean function) to make sure that the elements you
get back match the elements you put in. Most of the munging is to get
rid of extra elements IE adds to tables, so it's much, much faster
(especially for tables) to just start with a DOM node in the first place
if at all possible.
Cheers,
Luke
Josh Bush wrote:
Well, I feel stupid. it's not the join that's taking so long, it's
the $( really big DOM string with 1,000 rows and 3 columns) that
takes so dang long on IE7. After all of this rambling, does anyone
have any options for me to try?
Sorry, for the self-dialog here.
-Josh
On Aug 7, 8:42 pm, Josh Bush [EMAIL PROTECTED] wrote:
Well, FF2 performance is great at 500-600ms. IE7 is struggling with a
join of 1,000 elements to the tune of 70,000 ms!
Each array element contains a string, something like 'trtd1/
tdtd2/td/tr'
Any advice is greatly appreciated. I still feel like a noob in
javascript sometimes. :(
Josh
On Aug 7, 3:40 pm, Josh Bush [EMAIL PROTECTED] wrote:
I'm working on a project that makes a web service call and pulls back
data. Sometimes that data can be 1,000ish rows. What is the fastest
way that I can create those rows? Right now I'm just doing string
concatenation to make HTML and passing that to the .append method. I
read the other day where someone(Klaus?) said that array.join was a
faster way to do string concatenation.
I'd like to avoid the string concats all together if there is a faster
method. I'm just poking around for ideas.
Thanks
Josh
[jQuery] Re: Iframe events for local pages
To get elements by tag name in jQuery, do $('tagName')
Also, I suggest you do feature detection instead of browser
detection, as described here:
http://www.quirksmode.org/js/support.html
What I mean is, try something like this:
var frame = $('iframe')[0];
var frameDocument;
if(frame.contentDocument frame.contentDocument.documentElement) {
frameDocument = frame.contentDocument.documentElement;
} else if(document.frames[0] document.frames[0].document) {
frameDocument = document.frames[0].document;
} ...
Also, you can use frameDocument as a context to select stuff from the
iframe page:
$('#someElementInIFrame', frameDocument).bind('click', ...);
Hope it helps.
--Erik
On 8/8/07, julio [EMAIL PROTECTED] wrote:
I solved with this:
function doBind() {
var frame;
if ($.browser.msie) {
frame = document.frames[0].document;
} else {
frame = document.getElementsByTagName(iframe)
[0].contentDocument.documentElement;
}
$(frame).bind('click', function(event) { alert('an element in frame
is clicked ' + event.target.innerHTML) })
}
Is there a wrap of jquery for above if/else? Or more generic
question, is there a wrap to get a iframe/frame in jquery?
I'm searching in jquery docs but I have not found anything again
On Aug 8, 10:32 am, julio [EMAIL PROTECTED] wrote:
Ok thanks:) it works
but I'm interested to touch less possible sample.html.
And so I have tried this in main.html:
function doBind() {
var frame=document.getElementsByTagName(iframe)
[0].contentDocument.documentElement;
$(frame).bind('click', function(event) { alert('an element in frame
is clicked ' + event.target.innerHTML) })
}
it would be a kind of addEventListener (using jquery-bind).
On firefox 2.0.x it works but I suppose it's not good for explorer
because is present 'contentDocument.documentElement'
Have you any idea to make it cross-browser???
Thanks,
Julio
[jQuery] Re: Thickbox - why isn't the window centered?
Cees wrote: Hmm - browsing through the topic i read this at the top : On Aug 6, 9:15 pm, Andy Matthews [EMAIL PROTECTED] wrote: I have a page which contains a long listing of records. When I scroll down to the bottom, and click the thickbox trigger link, thickbox opens the modal window, but it's at the very top of the page, out of sight. So - Andy also noticed my problem of Thickbox flipping to Top of page instead of Top of Window - so there must be something in it - problem is i have to dig into the CSS expression - not quite my cup of tea. Thickbox 3 is based on some modifications I did, so maybe I can help. I'd like to know if the bug occurs in IE 7 or IE 6? The expression is used to emulate fixed positioning in IE 6, IE 7 supports fixed positioning. The problem is that if IE 7 runs in Quirks mode the star selector hack will be applied as well, so maybe IE 7 incorrectly applies the expression in addition to its already correct fixed positioning. You can check if IE 7 runs in Quirks mode by typing the following into the address bar and hit enter: alert(document.compatMode); If it alerts CSS1Compat it is Standards mode, if BackCompat, it's Quirks mode. --Klaus
[jQuery] Re: Fastest method to create table rows
Josh, Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. After all of this rambling, does anyone have any options for me to try? Sorry, for the self-dialog here. Just for testing purposes, you might want to test in IE by just using the DOM property innerHTML to set the table. This will at least tell you where the majority of overhead is coming from. Is it from jQuery's processing routines or for the actual DOM creation. In my experience IE6 is sluggish when trying to generate large tables on the fly. (This is pre-jQuery coding as well.) -Dan
[jQuery] Re: Iframe events for local pages
Erik Beeson wrote:
To get elements by tag name in jQuery, do $('tagName')
Also, I suggest you do feature detection instead of browser
detection, as described here:
http://www.quirksmode.org/js/support.html
What I mean is, try something like this:
var frame = $('iframe')[0];
var frameDocument;
if(frame.contentDocument frame.contentDocument.documentElement) {
frameDocument = frame.contentDocument.documentElement;
} else if(document.frames[0] document.frames[0].document) {
frameDocument = document.frames[0].document;
} ...
A little shorter and also instead of relying on a hardcoded frames[0]
reference, using the already existing reference through the frame variable:
var frameDocument = frame.contentWindow frame.contentWindow.document
|| frame.contentDocument.documentElement;
frame.contentWindow is IE specific, all other major browsers support
frame.contentDocument, thus I use this as fallback...
--Klaus
[jQuery] Re: An open letter to non-Believers...
On 8/8/07, Yehuda Katz [EMAIL PROTECTED] wrote: Hey, Send it to [EMAIL PROTECTED] :-D Hi, Yehuda! i did, a day or two after i originally posted it, but got no response. :( -- - stephan beal http://wanderinghorse.net/home/stephan/
[jQuery] some elements showing through thickbox
Hello everyone, Having a problem with thickbox, if you click send to a friend on the top right of this page http://wcmp.org/ You can see that some elements show through, I tried fixing this with z-index. I believe its because the menu css is set to absolute. Is there any way to fix this? Thanks -Tony
[jQuery] Re: Thickbox - why isn't the window centered?
On Aug 8, 3:10 pm, Klaus Hartl [EMAIL PROTECTED] wrote: I'd like to know if the bug occurs in IE 7 or IE 6? The expression is used to emulate fixed positioning in IE 6, IE 7 supports fixed positioning. Bug only occurs in IE6 (btw IE7 runs in Standards mode for my page).
[jQuery] Re: some elements showing through thickbox
Anthony Leboeuf(Worcester Wide Web) schrieb:
Hello everyone,
Having a problem with thickbox, if you click send to a friend on the
top right of this page http://wcmp.org/ You can see that some elements
show through, I tried fixing this with z-index. I believe its because
the menu css is set to absolute. Is there any way to fix this?
Thanks
-Tony
You have here set to 999 in thickbox is set to 100 for the overlay, you
can fix this so:
.topnav li {
float:left;
list-style:none;
position:relative;
z-index:99;
}
in your styles.css
--
Viele Grüße, Olaf
---
[EMAIL PROTECTED]
http://olaf-bosch.de
www.akitafreund.de
---
[jQuery] Re: Fastest method to create table rows
I had read somewhere that IE didn't support .innerHTML for the tbody element. Will I have to recreate the entire table HTML? Sorry for the noob question; I'm still a fish out of water in javascript at times. Josh On Aug 8, 8:18 am, Dan G. Switzer, II [EMAIL PROTECTED] wrote: Josh, Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. After all of this rambling, does anyone have any options for me to try? Sorry, for the self-dialog here. Just for testing purposes, you might want to test in IE by just using the DOM property innerHTML to set the table. This will at least tell you where the majority of overhead is coming from. Is it from jQuery's processing routines or for the actual DOM creation. In my experience IE6 is sluggish when trying to generate large tables on the fly. (This is pre-jQuery coding as well.) -Dan
[jQuery] [NEWS] jQuery in 15 Minutes Slideshow on Ajaxian
Ajaxian has a post describing Simon Willison's slideshare presentation jQuery in 15 minutes. The preso gives a nice view of some of jQuery's features and is a good intro for anyone wanting to know more about jQuery. http://ajaxian.com/archives/jquery-in-15-minutes
[jQuery] Re: An open letter to non-Believers...
On 8/8/07, Pops [EMAIL PROTECTED] wrote:
did was interrnal, no dependencies, plus, how can you compare pcode
compile server side applets to a slower PHP interpreative environment
which in reality did yield slower page rendering.
But PHP has always been relatively fast compared to, e.g. Java or even
client-side JavaScript. i started using PHP back in 1998 or 1999, and it was
blazing fast even back then.
Plus, and you might
related to this with your SpiderApe work, wcBASIC was a multidevice
system and included template technology that allowed console
development as well - an important part of a BBS system.
Amen. My first online experiences were the many BBS's of Houston, Texas.
While i never operated one, i was personal friends with a couple of sysops.
Very impressive work you are doing with SpiderApe. :-)
:D
You start with 10 lines of jQuery that would have been 20 lines of
tedious DOM JavaScript. By the time you are done it's down to two or
three lines and it couldn't get any shorter unless it read your mind.
- Dave Methvin
The Layer over layer syndrom. :-) Honestly, it all depends, layers
are suppose to simplify things, making it easier for programmers to
cover ideas with less coding.
In general i'm a big fan of layers, as long as...
You still need a basic understanding of
what it your are wrapping, and also understand when things do not
react as you expecting.
Amen. My stomach still wrenches at some of the questions which appear on the
jQuery form which demonstrate a complete lack of knowledge, not only of
JavaScript, but also of the fact that JS is a single layer in a very complex
environment. The recurring question that gets me the most is, how can I
rewrite this to guaranty that it is *completely* flicker-free. Aaarrrggg.
Every time i resist the urge to write back, you can start by understanding
the environment you're writing code for.
However, once it becomes its own complex
monster, it defeats the purpose. JQuery needs to pay attention to
natural tendency to add more stuff.
Amen, again. Qt is a great example of that. From what i've seen on the list,
the authors are pretty careful about that, though. IMO they could even
remove the Ajax features from the core and move it to a plugin, but my guess
is that 80%+ of the jQuery users do use the Ajax functions, so the core is
probably the best place for it. It would be an interesting exercise to strip
out the Ajax stuff and see how small jQ is without it.
There is an old great poster with the rethorical question:
What comes first? Marketing or Technology?
That is, unfortunately, unanswerable. Without us (technology) they would
have no products and without them we would never actually release anything.
It would stay in development forever.
What I think needs to be pointed out, is not what JQUERY offers, but
the language and syntax it offers. That is whats difference here, in
my opinion.
That's a fair point, but the time-savings of jQ are not only based in the
(considerable) powers of the language. e.g.:
$('#MyElement').css('background-color','red') is much more elegant than the
equivalent code using the standard DOM API.
The syntax is awkward, of course, until one recognizes that '$' is a legal
variable/function name in JavaScript. (Even then, it takes getting used to.)
I'm speaking for myself, but its powerful syntax is both a blessing
and a curse.
Amen. Writing structured code with it requires a lot of discipline. Same can
be said for PHP (or many/most other languages, for that matter).
It gives you the technology to work more productively
with DOM/CSS, but it doesn't help with marketing because you still
need a pretty good undersstanding of DOM and programming. So its not
for everyone.
True enough. Most web programmers out there appear to work only with WYSIWYG
HTML editors, and have no clue what those tools really do. Take away their
Dreamweaver and they're reduced to quivering jelly.
In addition, I believe strongly in pareto's principle in my
development. You are not going to get everyone usiing 100% of its
feature set. In geneal, most people will begin using only 20% of it
80% of the time. Just look at JTIP - it is distributed with a RISC
(Reduced Instruction Set Computer) version of JQUERY.JS.
i'll have to take a look at jtip. It sounds like it would be a good starting
point for the remove the ajax experiment.
Then we decide we need More. Now that jQuery has freed us from the
Tedium of the DOM, we want our web pages to do More. We want to add
animation effects, tabbed controls, and whatnot. Those are a lot of
work to implement, and we have not, so far, done so because it is so
tedious to do so.
And for others, like myself, we have the vision that the more you
think like this, someone is going to say Why not just download a
specialized frontend and qui? Its the old Fat vs thin paradign. You
want to do more with the Browser that
[jQuery] Re: Draggable - change revert after start and before stop
I have done this simply by hiding the dragger when it gets dropped
$('dropper').Droppable({accept:'dragger',
ondrop: function(drag){ $('.dragger').css('visibility','hidden')}
});
This may work out for you depending on if you need to Keep the dragger
visible or not. In my case, I clone the dragger properties (background,
border, ect) onto the dropper to give the appearance that the dragger stays
put.
SDE wrote:
If my draggable item does not reach a target, i want it to revert, so
I set revert by default.
When it hovers over a target, I want to set revert to false.
I can't make this work. I thought it would be as easy as putting the
following code in the onHover of the droppable:
$('#'+drag.id).Draggable({revert:false});
But it doesn't work. Can you change the value of revert in the middle
of a drag?
--
View this message in context:
http://www.nabble.com/Draggable---change-revert-after-start-and-before-stop-tf4235611s15494.html#a12053761
Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] Re: Selecting attributes of an element
Thanks
On Aug 8, 2:04 pm, Richard D. Worth [EMAIL PROTECTED] wrote:
On 8/8/07, voltron [EMAIL PROTECTED] wrote:
Excuse my newbiness, how do I select a particular attribute of an
element?
Example:
li test1 =foo test2=bar foobar/li
how do I select and return the test1 attribute?
var test1val = $(li).attr('test1');
alert(test1val == foo);
Seehttp://docs.jquery.com/DOM/Attributes#attr.28_name_.29
- Richard
[jQuery] ClueTIP name=Title showing in IE.
Karl, Found a IE vs FF behavior difference. The A links are using name=title attributes. In FF, they are not shown or atleast the delay is shown that the AJAX results appears and the title tip does not. In IE, it is always shown, so now you have two tips showing. -- HLS On Aug 7, 9:03 pm, Karl Swedberg [EMAIL PROTECTED] wrote: Welcome to jQuery! Glad you found us. :-) I'm also glad that the clueTip plugin is working for you. I'm still trying to squash one annoying bug that is arising on one web site in particular, although I haven't seen it anywhere else. As soon as that is out of the way, I'll be releasing another update -- and I think it'll finally be worthy of adding to the jquery.com/plugins repository. In the meantime, if you discover any bugs or annoyances with the plugin, feel free to send me an email and I'll see what I can do to make things right. Also, if you want a sneak peek at version 0.8 (I have no idea how to version things; just making it up as I go along), then you can see a new demo here: http://examples.learningjquery.com/67/demo/ --Karl _ Karl Swedbergwww.englishrules.comwww.learningjquery.com On Aug 7, 2007, at 5:26 PM, Pops wrote: First, KUDOS to the developers of JQUERY. I just discovered it a few days ago and with it, I continue to be amazed of the on-going web 2.0 tool developments! Being an old school guy, I still have my concerns about where all this web 2.0 stuff is going, but once you begin to use it more and you begin to put all those pragmatic negatives asidem you realize how powerful it all really is! I think what got me is seeing the power of javascript, I mean, JQUERY is basically a another language layer - a powerful one at that too, that I simply never knew was possible. I do hope that I may continue to use it (learning yet another language syntax) within my products and hopefully contribute to its development. I discovered jquery via jtip when a request was made by customers to add an ajax-based preview to our mail system. I made some mods to jtip and was looking to modify it even more to address concerns related dimensions and hoverIntent ideas that I eventually found to be implemented via ClueTip. Well, I just finished migrating to ClueTip and thats why I am writing now. - It works great! Less ajax calls, and popups are not clipped! Well, I am sure the developers are very proud of their work - and they should be. I may be a day late in saying this, but thanks for a GREAT PIECE OF WORK! Thanks -- HLS
[jQuery] Metdata
Hi all, I've got some problems with the metadata plugin. First, i tried to use it on element that are cloned. Metadata are not cloned and are shared with all the cloned elements and the original one. The second thing i'm trying to do is to put class type metadata (named myId) on each tr of a table. I used tablesorter v2, and with a widget i need to manipulate the metadata. Problem is, after i sort the table by clicking on headers, the metadata seems to be lost. I don't get how to use metdata in script markup, but that's not important 'cause I'm not a big fan of embed script =/ If you have any idea, i would be pleased to hear of it =P Tcho __ Romain
[jQuery] How to check input field
In a form there is an input field where users insert their email address. How can I check if it is the valid email or that it consists `@' . Thank you for help L.
[jQuery] Re: appfuse: jQuery + scriptaculous + datePicker
Thank you both, Kelvin and Klaus, for your replies.
Yes, I saw that page and after a quick read decided (incorrectly) it
was above my jQuery pay-grade and that it didn't apply to me. But as
it turns out, if I put the jQuery.noConflict(); line in my page before
calling the datePicker() function, the errors go away. Excellent!
... but my calendar doesn't appear! :( No errors, but no calendar. I
think I have everything configured correctly:
I include the jquery-1.1.2.js, date.js, date_es.js,
jquery.dimensions.js, and datePicker.js libraries
I include the datePicker.css and demo.css style files
I include the snippet of js code that defines the datePicker - $
('.date-pick').datePicker({clickInput:true});
I create an input that has the 'date-picker' style class
And the calendar doesn't appear. There's no link next to the input nor
is the input click-able. What could I be doing wrong?
Many thanks!
Bob
On Aug 8, 1:13 pm, Klaus Hartl [EMAIL PROTECTED] wrote:
syg6 wrote:
Hello all.
I posted this over at Appfuse's Nabble list as first, but then thought
this would be the better place.
I have a default.jsp page that uses SiteMesh to 'decorate' all of my
jsps. It contains the following js libraries:
prototype.js
scriptaculous.js
global.js
In order to use datePicker you need the following js libraries:
jquery-1.x.js
date.js
jquery-dimensions.js
jquery-datepicker.js
I put those 4 js files in my test.jsp file. But when the test.jsp page
is rendered, including all the stuff in default.jsp, Firefox goes
berserk. I get thousands of js errors, all in effects.js:
this._base has no properties,http://localhost:8080/scripts/effects.js,
Line 516
This also happens if I put my jquery.js in default.jsp after
scriptaculous.js. However, if I put it before scriptaculous.js I get
no errors. But my calendar doesn't work! No errors, just doesn't
appear!
And if I comment out scriptaculous.js in default.jsp, and leave
jquery.js in test.jsp, my calendar works. Oddly enough, the calendar
appears in the bottom left corner of the screen and without any
styles. It seems it's not grabbing either the datepicker.css or
demo.css it needs, I don't know.
Anyone ever used datePicker, or more generally, scriptaculous +
jquery? It seems that the order you put them in your page is
important. It seems like if you put jquery after scriptaculous it goes
into a loop, when jquery's constructor is called, and never exits.
Thanks!
Bob
This should help you:http://docs.jquery.com/Using_jQuery_with_Other_Libraries
--Klaus
[jQuery] Thickbox with Forms Plugin
Hey all. I am trying to use thickbox with the forms ajax plugin to upload files. I have copied the example exactly. However when I go to submit the form, the entire page is reloaded with the success message. I don't know if the forms plugin is having problems connecting to the form because the form is a hidden form? Am I missing something? Thanks for the help.
[jQuery] tabs, cookies and keeping state
I am using Klaus' tabs plugin with ajaxform and tabs remote:true. What I am trying to do is have a user login, then set up tabs based on their database profile. Each tab is a remote tab to a separate php page which requires a parameter to be passed in eg the file the tab call is users.php?user_ID=xxx which is derived from the login and set as a cookie. Everything works fine. The correct tabs are enabled/disabled by matching the database returns. But down in the page, where the link to the remote php page is - the cookie isn't set unless I reload the page? How do I do this?
[jQuery] Re: BlockUI: Odd behaviour in Internet Explorer
Hi Bhusan, I'll see if I can figure out what the issue is with this. Mike also but the progress bar is still showing incomplete.I am not able to find out any solution for this.If the progress bar is showing in loading state only. Please guide me on this. Regards Bhusan
[jQuery] Re: appfuse: jQuery + scriptaculous + datePicker
Because you are using jQuery in noConflict mode you can no longer use $
to create jquery objects. So you need to replace:
$('.date-pick').datePicker({clickInput:true});
with:
jQuery('.date-pick').datePicker({clickInput:true});
Hope that helps,
Kelvin :)
syg6 wrote:
Thank you both, Kelvin and Klaus, for your replies.
Yes, I saw that page and after a quick read decided (incorrectly) it
was above my jQuery pay-grade and that it didn't apply to me. But as
it turns out, if I put the jQuery.noConflict(); line in my page before
calling the datePicker() function, the errors go away. Excellent!
... but my calendar doesn't appear! :( No errors, but no calendar. I
think I have everything configured correctly:
I include the jquery-1.1.2.js, date.js, date_es.js,
jquery.dimensions.js, and datePicker.js libraries
I include the datePicker.css and demo.css style files
I include the snippet of js code that defines the datePicker - $
('.date-pick').datePicker({clickInput:true});
I create an input that has the 'date-picker' style class
And the calendar doesn't appear. There's no link next to the input nor
is the input click-able. What could I be doing wrong?
Many thanks!
Bob
[jQuery] Re: Thickbox - why isn't the window centered?
Klaus... That helps...but I won't know in advance if someone is using 6 or 7. Is there a way to force this hack to only apply to the correct browser version? andy -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Klaus Hartl Sent: Wednesday, August 08, 2007 8:11 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Thickbox - why isn't the window centered? Cees wrote: Hmm - browsing through the topic i read this at the top : On Aug 6, 9:15 pm, Andy Matthews [EMAIL PROTECTED] wrote: I have a page which contains a long listing of records. When I scroll down to the bottom, and click the thickbox trigger link, thickbox opens the modal window, but it's at the very top of the page, out of sight. So - Andy also noticed my problem of Thickbox flipping to Top of page instead of Top of Window - so there must be something in it - problem is i have to dig into the CSS expression - not quite my cup of tea. Thickbox 3 is based on some modifications I did, so maybe I can help. I'd like to know if the bug occurs in IE 7 or IE 6? The expression is used to emulate fixed positioning in IE 6, IE 7 supports fixed positioning. The problem is that if IE 7 runs in Quirks mode the star selector hack will be applied as well, so maybe IE 7 incorrectly applies the expression in addition to its already correct fixed positioning. You can check if IE 7 runs in Quirks mode by typing the following into the address bar and hit enter: alert(document.compatMode); If it alerts CSS1Compat it is Standards mode, if BackCompat, it's Quirks mode. --Klaus
[jQuery] Re: Thickbox - why isn't the window centered?
Andy Matthews wrote: Klaus... That helps...but I won't know in advance if someone is using 6 or 7. Is there a way to force this hack to only apply to the correct browser version? Yes, make sure that IE 7 runs in standards mode. --Klaus
[jQuery] Re: Thickbox - why isn't the window centered?
I'm working on legacy code, I don't think we're even specifying a doctype. Short of forcing a doctype on IE7, is there any other way around it? -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Klaus Hartl Sent: Wednesday, August 08, 2007 9:12 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: Thickbox - why isn't the window centered? Andy Matthews wrote: Klaus... That helps...but I won't know in advance if someone is using 6 or 7. Is there a way to force this hack to only apply to the correct browser version? Yes, make sure that IE 7 runs in standards mode. --Klaus
[jQuery] Re: Thickbox - why isn't the window centered?
Andy Matthews wrote:
I'm working on legacy code, I don't think we're even specifying a doctype.
Short of forcing a doctype on IE7, is there any other way around it?
Overwrite the particular properties with selectors with higher
specificity and hide them from IE 6:
htmlbody #TB_window { /* IE 6 won't notice, IE 7 will apply */
position: fixed;
}
* html #TB_window {
position: absolute;
}
(Before somebody asks, no, the universal selector does not add to
specificity.)
--Klaus
[jQuery] Re: Thickbox - why isn't the window centered?
Great. I'll give that a shot Klaus. Thank you.
-Original Message-
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Klaus Hartl
Sent: Wednesday, August 08, 2007 9:32 AM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: Thickbox - why isn't the window centered?
Andy Matthews wrote:
I'm working on legacy code, I don't think we're even specifying a doctype.
Short of forcing a doctype on IE7, is there any other way around it?
Overwrite the particular properties with selectors with higher specificity
and hide them from IE 6:
htmlbody #TB_window { /* IE 6 won't notice, IE 7 will apply */
position: fixed;
}
* html #TB_window {
position: absolute;
}
(Before somebody asks, no, the universal selector does not add to
specificity.)
--Klaus
[jQuery] Re: Iframe events for local pages
Ok, thanks for useful replies.
Last question:
I know that is not possible load dinamically filename.css for a
iframe content.
And so I need to put:
link rel=stylesheet href=filename.css
in sample.html (page loaded in iframe).
Do you know if exist a way to toggle/add/removeClass in jquery
dinamically (css-class below for example) for iframe-elements?
.hover {
cursor: pointer;
border-width: 3px;
border-style: solid;
border-color: #FF;
}
I tried to put this in main.html:
$(frame).bind('mouseover', function(event) {
var element = $(event.target);
element.addClass('hover');
})
it works only if i put link rel=stylesheet href=filename.css above
in sample.html (or class above in style /)
is it possible create and load a class dinamically with jquery
avoiding to modify sample.html???
Thanks,
Julio
[jQuery] Announcement: Spoilers plugin
Hi, all! Yet another plugin: http://jquery.com/plugins/project/Spoilers Demo: http://wanderinghorse.net/computing/javascript/jquery/spoilers/demo.html It is used to hide spoiler text from casual readers, who can reveal the text by mousing over it. See the web site for an example of how this can be useful. The code is based upon this jQuery forum thread: http://groups.google.com/group/jquery-en/browse_thread/thread/9d34cad45e541e36/8f02c8f79b5c7985 Many thanks to Michael Geary and Jay Salvat for doing the detective work in figuring out how this feature works on the imdb.com site. The code is trivial (a couple of lines) and it should work in any jQ- supported browser, though it is untested aside from Firefox 2.x, Konqueror 3.5.x, and Galeon 2.0.x. :)
[jQuery] Re: Announcement: Spoilers plugin
Stephan, That kinda cool, thanks for sharing. On 8/8/07, Stephan Beal [EMAIL PROTECTED] wrote: Hi, all! Yet another plugin: http://jquery.com/plugins/project/Spoilers Demo: http://wanderinghorse.net/computing/javascript/jquery/spoilers/demo.html It is used to hide spoiler text from casual readers, who can reveal the text by mousing over it. See the web site for an example of how this can be useful. The code is based upon this jQuery forum thread: http://groups.google.com/group/jquery-en/browse_thread/thread/9d34cad45e541e36/8f02c8f79b5c7985 Many thanks to Michael Geary and Jay Salvat for doing the detective work in figuring out how this feature works on the imdb.com site. The code is trivial (a couple of lines) and it should work in any jQ- supported browser, though it is untested aside from Firefox 2.x, Konqueror 3.5.x, and Galeon 2.0.x. :) -- Benjamin Sterling http://www.KenzoMedia.com http://www.KenzoHosting.com
[jQuery] Re: tooltip effect problem
It looks like the interface tooltip is automatically adding that text for you, I am not sure what the best way to trim the text for this plugin would be. You might want to look at some other tooltip plugins such as http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/ Tooltip or http://codylindley.com/Javascript/264/jtip-a-jquery-tool-tip jtip as they seem to allow for some more customization. -- View this message in context: http://www.nabble.com/tooltip-effect-problem-tf4236901s15494.html#a12056479 Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] i need to build a tree dynamic...
Hi!!! I've a doubtI dont know how to implement a tree dinamic with jquery... I see de treeview api but the tree's structure is in the body how can i build dynamically this tree with jquery?
[jQuery] Postcode Regex Form Validation
Just spent a while working out how to do this with the form Validation
plugin from http://bassistance.de/jquery-plugins/jquery-plugin-validation/
, but it's actually really logical when you get it. Still, might save
someone else the effort!
UK Postcodes have a fixed format and a standard regex to check against
[1], so you can check them simply, if you define a postcode method to
the validator plugin.
To do this:
code
jQuery.validator.addMethod(postcode, function(value) {
return /\b([A-PR-UWYZ][A-HK-Y0-9][A-HJKSTUW0-9]?[ABEHMNPRVWXY0-9]?)
*[0-9][ABD-HJLN-UW-Z]{2}\b/.test(value);
}, Please specify a valid postcode (all letters should be
uppercase));
}
/code
Then, whenever you want to check against it:
input name=postcode class={postcode:true} /
Easy!
Not quite worked out how to check multiple inputs with the same name
though (as you get when you have a form that accepts an arbitrary
number of addresses, and normally handled in PHP by using names like
postcode[], putting the results in an array for use).
Any suggestions?
[1] /\b([A-PR-UWYZ][A-HK-Y0-9][A-HJKSTUW0-9]?[ABEHMNPRVWXY0-9]?) *[0-9]
[ABD-HJLN-UW-Z]{2}\b/ - technically, the space is required, but you
can always correctly determine the position if it's left out, so I
relaxed the server side processing on that point, and it would make
sense to relax it on the client side too.
[jQuery] Re: Announcement: Spoilers plugin
You like developing plugins don't you? ;)
How about an option to show the spoilers when you click on a link
'show spoilers'. I've seen a few forums (can't think of the exact
URL's off the top of my head though) that have this. e.g. $
('.jqSpoiler').initSpoilers(click) or $
('.jqSpoiler').initSpoilers(hover)
I would think being able to specify the show behavior would be nice. It's
easy to accidentally hover over text or to have the cursor resting in a spot
that would reveal the spoiler text by default.
-Dan
[jQuery] Re: tooltip effect problem
senzacionale wrote: i have one problem with tooltip effect I want to cut url adress, becouse if it is too long then it show over the edge, over the witdh: 150px. how can i cut it? I think this a more of a problem with the browser (Im guessing you are using firefox) , than with the tooltip. Firefox refuses to word wrap text if it does not have any spaces in it (like a url) regardless of the width specified on the element. To the best of my knowledge there is no way to solve this with css. You should be able to use a javascript substr(x) where x is the number of characters you want to be allowed to display and then possibly follow that with a '...' to show it has been cut off. var url = 'thisisareallylongstringthatgoesoutsideoftheboundsofmytooltipboxanditlooksreallyhorrblebecauseitwillnotwrap' foo url.substr(12)... -- View this message in context: http://www.nabble.com/tooltip-effect-problem-tf4236901s15494.html#a12055639 Sent from the JQuery mailing list archive at Nabble.com.
[jQuery] Re: Announcement: Spoilers plugin
On Aug 8, 6:17 pm, Sam Collett [EMAIL PROTECTED] wrote:
You like developing plugins don't you? ;)
:D
jQuery makes it too easy to do. This particular plugin has a trivial
implementation:
jQuery.fn.initSpoilers = function( props ) {
props = jQuery.extend({
revealedClass:'reveal'
},
props ? props : {});
this.hover(
function() { $
(this).addClass( props.revealedClass ); },
function() { $
(this).removeClass( props.revealedClass ); }
);
return this;
};
Most of the real work happens via CSS.
How about an option to show the spoilers when you click on a link
'show spoilers'. I've seen a few forums (can't think of the exact
URL's off the top of my head though) that have this. e.g. $
('.jqSpoiler').initSpoilers(click) or $
('.jqSpoiler').initSpoilers(hover)
i was thinking not only of that, but also of how best to integrate
optional hoverIntent support (since hoverIntent is quite popular). i'm
trying to consolidate the discrepancies between click and hover, so
that the option can be integrated in a unified way (i hate special-
case code).
For the click, i was thinking: clicking on the overlay will unhide the
text, and mouse-out will hide it again, but that might be tedious/
annoying in practice (haven't tried it yet). Your thoughts? Should a
second click be required to re-hide the text? i think re-hiding may
not be necessary: if a click is used to un-hide then the user
obviously wants to reveal the text, and re-hiding it is probably not
desired.
[jQuery] Re: Fastest method to create table rows
You might find this useful: http://www.quirksmode.org/dom/innerhtml.html It's a speed comparison of various (non-jQuery) ways to create a 50x50 table. On 8/8/07, Josh Bush [EMAIL PROTECTED] wrote: I had read somewhere that IE didn't support .innerHTML for the tbody element. Will I have to recreate the entire table HTML? Sorry for the noob question; I'm still a fish out of water in javascript at times. Josh On Aug 8, 8:18 am, Dan G. Switzer, II [EMAIL PROTECTED] wrote: Josh, Well, I feel stupid. it's not the join that's taking so long, it's the $( really big DOM string with 1,000 rows and 3 columns) that takes so dang long on IE7. After all of this rambling, does anyone have any options for me to try? Sorry, for the self-dialog here. Just for testing purposes, you might want to test in IE by just using the DOM property innerHTML to set the table. This will at least tell you where the majority of overhead is coming from. Is it from jQuery's processing routines or for the actual DOM creation. In my experience IE6 is sluggish when trying to generate large tables on the fly. (This is pre-jQuery coding as well.) -Dan -- Aaron Heimlich Web Developer [EMAIL PROTECTED] http://aheimlich.freepgs.com
[jQuery] Re: jQuery Zen Garden Interface
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Richard D. Worth Sent: Wednesday, August 08, 2007 3:18 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: jQuery Zen Garden Interface Very nice! What a great demonstration of the power of jQuery. A couple things as I was playing around: Thanks that feels good after working alone on this for so long? - Your Sort Modes checkboxes are acting like 2 sets of radio buttons (Text -or- Icon, FirstLast -or- LastFirst -or- Taxonomic) What are you saying here? That they should be radio buttons? I don't see anything particularly bad about using checkboxes as radio buttons. - With the Sound on checkbox unchecked, the sound still plays for the last three Sort Modes checkboxes (FirstLast, LastFirst, Taxonomic) and the green 3-state button Thanks I somehow missed that. Very much appreciate your comments. - Richard On 8/8/07, Mitchell Waite [EMAIL PROTECTED] wrote: http://www.whatbird.com/wwwroot/Components/Complete_Search_Tab.html I called this Zen Garden because I was thinking it would be cool if there was a number of jQuery examples that demonstrated how to use the various incredible plugins that are available. This interface is an example of what a novice non programmer can do using jQuery and a number of its best plugins. The project was an inspiration to me because of how much I could accomplish with so little code. I had to become familiar with a large number of topics that are very technical, but I had a lot of hand hold and help from the community. I plan to say a lot more about what is in this page, as I believe it captures many of the best things about jQuery. Its going to grow a lot too. PS I am sure my coding and structure could be vastly improved upon. So please don't laugh too hard when you look close. Plugin Description and comments Accordion (Resig/Dan) Easing Checkboxes Tabs This was the hardest of all the plugins to get working. Match List Click on Acadian Flycatcher in the left panel of bids. It will open the overview or mini species page Mini species page Contains a summary of the bird. Green button takes you to the main species page. Sort Mode Click on Icon checkbox. Note how two buttons are disabled below it. Notice the nice visual fade effects and the way the cursor spins when the client has to wait for the server to load a page. Attribute Panel Click on the Basic attributes menu then click on Shape, Location and Size
[jQuery] Re: jQuery Zen Garden Interface
The search input is not working yet :) Sorry. What do you mean exactly by this: maybe make the whole UI in a draggable, resizable window and you're one step further ! Do you mean put the tab interface inside a window that can be moved? Why? Thanks for the nice feedback. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Alexandre Plennevaux Sent: Wednesday, August 08, 2007 4:05 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: jQuery Zen Garden Interface nice! it works quite well on WINXPSP2 FF2006 ! i just couldn't make the search input field work maybe make the whole UI in a draggable, resizable window and you're one step further ! good job Mitchell! Alex _ From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Mitchell Waite Sent: mercredi 8 aoűt 2007 6:16 To: jquery-en@googlegroups.com Subject: [jQuery] jQuery Zen Garden Interface HYPERLINK http://www.whatbird.com/wwwroot/Components/Complete_Search_Tab.htmlhttp:// www.whatbird.com/wwwroot/Components/Complete_Search_Tab.html I called this Zen Garden because I was thinking it would be cool if there was a number of jQuery examples that demonstrated how to use the various incredible plugins that are available. This interface is an example of what a novice non programmer can do using jQuery and a number of its best plugins. The project was an inspiration to me because of how much I could accomplish with so little code. I had to become familiar with a large number of topics that are very technical, but I had a lot of hand hold and help from the community. I plan to say a lot more about what is in this page, as I believe it captures many of the best things about jQuery. Its going to grow a lot too. PS I am sure my coding and structure could be vastly improved upon. So please don't laugh too hard when you look close. Plugin Description and comments Accordion (Resig/Dan) Easing Checkboxes Tabs This was the hardest of all the plugins to get working. Match List Click on Acadian Flycatcher in the left panel of bids. It will open the overview or mini species page Mini species page Contains a summary of the bird. Green button takes you to the main species page. Sort Mode Click on Icon checkbox. Note how two buttons are disabled below it. Notice the nice visual fade effects and the way the cursor spins when the client has to wait for the server to load a page. Attribute Panel Click on the Basic attributes menu then click on Shape, Location and Size Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.476 / Base de données virus: 269.11.8/941 - Date: 7/08/2007 16:06
[jQuery] Re: [NEWS] jQuery in 15 Minutes Slideshow on Ajaxian
Ajaxian has a post describing Simon Willison's slideshare presentation jQuery in 15 minutes. The preso gives a nice view of some of jQuery's features and is a good intro for anyone wanting to know more about jQuery. http://ajaxian.com/archives/jquery-in-15-minutes I’ve learned from slide 11 the really not obvious meaning of the end () method. I thought it was intended to move to the end of a selection, without having any idea what use I could have for it... ;-) I didn't find any reason for this name in the list archive. What about revert() or something else more obvious? I know it's late to change this, even more with it being used in tutorials, but maybe a better name could be given to an alias... -Nicolas -- Nicolas Brush HOIZEY Clever Age : http://www.clever-age.com/ Gastero Prod : http://www.gasteroprod.com/ Photos : http://www.flickr.com/gp/[EMAIL PROTECTED]/M1c002
[jQuery] Re: jQuery Zen Garden Interface
I will look into that issue with FF on the Mac. Its so hard to keep up with all these different browsers. Appreciate your feedback. From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Erik Beeson Sent: Wednesday, August 08, 2007 12:21 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: jQuery Zen Garden Interface There is a weird glitch in FF2/Mac. The left scrolling pane works properly with the mouse wheel, but the scroll bar looks like it's making content in the background scroll. The content that is supposed to scroll doesn't move when using the scroll bar. It works correctly in Safari/Mac. Otherwise, it looks good. --Erik
[jQuery] Re: tooltip effect problem
On Aug 8, 2007, at 11:30 AM, seedy wrote: senzacionale wrote: i have one problem with tooltip effect I want to cut url adress, becouse if it is too long then it show over the edge, over the witdh: 150px. how can i cut it? I think this a more of a problem with the browser (Im guessing you are using firefox) , than with the tooltip. Firefox refuses to word wrap text if it does not have any spaces in it (like a url) regardless of the width specified on the element. To the best of my knowledge there is no way to solve this with css. Couldn't you just apply overflow: hidden to the element in your stylesheet? --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: i need to build a tree dynamic...
cesar, are you referring to the tree view plugin? ( http://bassistance.de/jquery-plugins/jquery-plugin-treeview/) On 8/8/07, cesar c [EMAIL PROTECTED] wrote: Hi!!! I've a doubtI dont know how to implement a tree dinamic with jquery... I see de treeview api but the tree's structure is in the body how can i build dynamically this tree with jquery? -- Benjamin Sterling http://www.KenzoMedia.com http://www.KenzoHosting.com
[jQuery] Re: Announcement: Spoilers plugin
On Aug 8, 6:28 pm, Stephan Beal [EMAIL PROTECTED] wrote:
For the click, i was thinking: clicking on the overlay will unhide the
text, and mouse-out will hide it again, but that might be tedious/
@Sam Dan:
i've added click-toggle and hoverIntent support via an optional init
parameter:
$('.jqSpoiler').initSpoilers({method:'click'});
$('.jqSpoiler').initSpoilers({method:'hoverIntent'}); // requires
hoverIntent plugin
The default is method:'hover'.
This doubled the MIN'd size of the code, though. It's now a whopping
424 bytes ;).
These features will be included in tomorrow's release. (i use the date
as the version number, and i've already made a release today, so i've
gotta wait another 5 hours [CET/GMT+1] before i can make a new
release ;).
You can have multiple types of spoiler revealing on one page by simply
using a marker class, like this:
// On-hover spoiler:
$('.jqSpoiler').initSpoilers();
// On-hover spoiler using hoverIntent plugin:
$('.jqSpoilerIntent').initSpoilers({method:'hoverIntent'})
.addClass('jqSpoiler');
// Clickable spoiler:
$('.jqSpoilerClick').initSpoilers({method:'click'})
.addClass('jqSpoiler');
The addClass() is used to ensure that the items marked with the marker
classes get the same CSS treatment.
[jQuery] Re: i need to build a tree dynamic...
On Aug 8, 5:10 pm, cesar c [EMAIL PROTECTED] wrote: I've a doubtI dont know how to implement a tree dinamic with jquery... I see de treeview api but the tree's structure is in the body how can i build dynamically this tree with jquery? You can build any DOM elements dynamically in jQuery using a number of techniques. One of the simplest is: $(body).append(divdynamically-created content/div); See: http://docs.jquery.com/API/1.1.2/Core#.24.28_html_.29
[jQuery] SITE SUBMISSION: http://www.thor.be/creations.php
Friends, i'm very pleased to inform you about the fresh release of Belgian contemporary dance Compagnie Thor new website: HYPERLINK http://www.thor.be/http://www.thor.be/ use of jquery for: - layouting via dimensions.js - thickbox - jscrollpane (HYPERLINK http://www.thor.be/creations.phphttp://www.thor.be/creations.php) - ajax with hoverIntent (HYPERLINK http://www.thor.be/creations.phphttp://www.thor.be/creations.php) - cluetip HYPERLINK http://www.thor.be/agenda.phphttp://www.thor.be/agenda.php and some tweaks here and there... A special thanks to John Resig and also to each plugin author, i hope you like how i used your work ! Alexandre Alexandre Plennevaux - LAb[au] asbl.vzw / MediaRuimte Lakensestraat/Rue de Laeken 104 B-1000 Brussel-Bruxelles-Brussels Belgie-Belgique-Belgium Tel:+32(0)2.219.65.55 Fax:+32(0)2.426.69.86 Mobile:+32(0)476.23.21.42 HYPERLINK blocked::http://www.lab-au.com/http://www.lab-au.com HYPERLINK blocked::http://www.mediaruimte.be/http://www.mediaruimte.be HYPERLINK blocked::http://www.mediaruimte.be/__ The information in this e-mail is intended only for the addressee named above. If you are not that addressee, please note that any disclosure, distribution or copying of this e-mail is prohibited. Because e-mail can be electronically altered, the integrity of this communication cannot be guaranteed. __ Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.476 / Base de données virus: 269.11.8/941 - Date: 7/08/2007 16:06
[jQuery] Re: jQuery Zen Garden Interface
Do you mean put the tab interface inside a window that can be moved? Why? Exactly, Why? Just to show even bigger muscles :) -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Mitchell Waite Sent: mercredi 8 aoűt 2007 17:54 To: jquery-en@googlegroups.com Subject: [jQuery] Re: jQuery Zen Garden Interface The search input is not working yet :) Sorry. What do you mean exactly by this: maybe make the whole UI in a draggable, resizable window and you're one step further ! Do you mean put the tab interface inside a window that can be moved? Why? Thanks for the nice feedback. -Original Message- From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Alexandre Plennevaux Sent: Wednesday, August 08, 2007 4:05 AM To: jquery-en@googlegroups.com Subject: [jQuery] Re: jQuery Zen Garden Interface nice! it works quite well on WINXPSP2 FF2006 ! i just couldn't make the search input field work maybe make the whole UI in a draggable, resizable window and you're one step further ! good job Mitchell! Alex _ From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On Behalf Of Mitchell Waite Sent: mercredi 8 aout 2007 6:16 To: jquery-en@googlegroups.com Subject: [jQuery] jQuery Zen Garden Interface HYPERLINK http://www.whatbird.com/wwwroot/Components/Complete_Search_Tab.htmlhttp:// www.whatbird.com/wwwroot/Components/Complete_Search_Tab.html I called this Zen Garden because I was thinking it would be cool if there was a number of jQuery examples that demonstrated how to use the various incredible plugins that are available. This interface is an example of what a novice non programmer can do using jQuery and a number of its best plugins. The project was an inspiration to me because of how much I could accomplish with so little code. I had to become familiar with a large number of topics that are very technical, but I had a lot of hand hold and help from the community. I plan to say a lot more about what is in this page, as I believe it captures many of the best things about jQuery. Its going to grow a lot too. PS I am sure my coding and structure could be vastly improved upon. So please don't laugh too hard when you look close. Plugin Description and comments Accordion (Resig/Dan) Easing Checkboxes Tabs This was the hardest of all the plugins to get working. Match List Click on Acadian Flycatcher in the left panel of bids. It will open the overview or mini species page Mini species page Contains a summary of the bird. Green button takes you to the main species page. Sort Mode Click on Icon checkbox. Note how two buttons are disabled below it. Notice the nice visual fade effects and the way the cursor spins when the client has to wait for the server to load a page. Attribute Panel Click on the Basic attributes menu then click on Shape, Location and Size Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.476 / Base de données virus: 269.11.8/941 - Date: 7/08/2007 16:06 Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.476 / Base de données virus: 269.11.8/941 - Date: 7/08/2007 16:06
[jQuery] Re: jQuery Zen Garden Interface
Mitchell, - Your Sort Modes checkboxes are acting like 2 sets of radio buttons (Text -or- Icon, FirstLast -or- LastFirst -or- Taxonomic) What are you saying here? That they should be radio buttons? I don't see anything particularly bad about using checkboxes as radio buttons. Users have an expectation that a checkbox is used to toggle the state (i.e. you can both check and uncheck) of the item. So, when your checkbox is actually working like a radio element users can be confused because you can't uncheck an option--which is what is expected. -Dan
[jQuery] Re: SITE SUBMISSION: http://www.thor.be/creations.php
Wow, there is some really cool UI stuff going on in that site. Fabulous. Well done, Alexandre! --Karl _ Karl Swedberg www.englishrules.com www.learningjquery.com On Aug 8, 2007, at 2:24 PM, Alexandre Plennevaux wrote: Friends, i'm very pleased to inform you about the fresh release of Belgian contemporary dance Compagnie Thor new website: http://www.thor.be/ use of jquery for: - layouting via dimensions.js - thickbox - jscrollpane (http://www.thor.be/creations.php) - ajax with hoverIntent (http://www.thor.be/creations.php) - cluetip http://www.thor.be/agenda.php and some tweaks here and there... A special thanks to John Resig and also to each plugin author, i hope you like how i used your work ! Alexandre Alexandre Plennevaux - LAb[au] asbl.vzw / MediaRuimte Lakensestraat/Rue de Laeken 104 B-1000 Brussel-Bruxelles-Brussels Belgie-Belgique-Belgium Tel:+32(0)2.219.65.55 Fax:+32(0)2.426.69.86 Mobile:+32(0)476.23.21.42 http://www.lab-au.com http://www.mediaruimte.be __ The information in this e-mail is intended only for the addressee named above. If you are not that addressee, please note that any disclosure, distribution or copying of this e-mail is prohibited. Because e-mail can be electronically altered, the integrity of this communication cannot be guaranteed. __ Ce message Envoi est certifié sans virus connu. Analyse effectuée par AVG. Version: 7.5.476 / Base de données virus: 269.11.8/941 - Date: 7/08/2007 16:06
[jQuery] Re: [New Plugins] Ajax Queue and Ajax Sync
wow, thanks mike... that was really helpful... i will try that.
John, ignore my feature request ;-)
-GTG
On 8/8/07, Mike Alsup [EMAIL PROTECTED] wrote:
Ganeshji,
I you want control over ajax error handling you can just redefine the
jQuery.httpSuccess function. That fn simply returns a boolean. It is
currently implemented as follows:
httpSuccess: function( r ) {
try {
return !r.status location.protocol == file: ||
( r.status = 200 r.status 300 ) || r.status == 304 ||
jQuery.browser.safari r.status == undefined;
} catch(e){}
return false;
}
Mike
On 8/8/07, Ganeshji Marwaha [EMAIL PROTECTED] wrote:
I didnt find much use for these right now, but i am sure, the day won't
be
far when this will save my day...
I am more interested in a plugin (or in the core itself) that will allow
me
to tell jquery what an error as it applies to ajax.
At present, i guess that it is hard-coded within, which is not much
useful
for handling application specific errors. And i think the error handler
is
the cleanest place to handle app specific errors.
Just so you know mootools has this feature.
-GTG
On 8/7/07, John Resig [EMAIL PROTECTED] wrote:
In the source of the URL that I linked to. I also just added it to the
main contents, to make it easier to access.
--John
On 8/7/07, Christopher Jordan [EMAIL PROTECTED] wrote:
Those sound really useful! Where can we get the code?
Cheers,
Chris
On 8/7/07, John Resig [EMAIL PROTECTED] wrote:
Hey everyone -
So Mike Hostetler was telling me about some Ajax queueing plugins
that
he wanted to write - so I got some ideas, and less than an hour
later
- here are two new Ajax queueing plugins for you to enjoy!
Lame demo:
http://dev.jquery.com/~john/plugins/ajaxqueue/
About the plugins:
* Queued Ajax requests. A new Ajax request won't be started until
the
previous queued request has finished.
Example:
jQuery.ajaxQueue({
url: test.php,
success: function(html){
jQuery(ul).append(html); }
});
* Synced Ajax requests. The Ajax request will happen as soon as
you
call this method, but the callbacks (success/error/complete) won't
fire until all previous synced requests have been completed.
Example:
jQuery.ajaxSync({
url: test.php,
success: function(html){
jQuery(ul).append(b+html+/b); }
});
Both have their uses, but ajaxSync, in particular, seems quite
useful.
Let me know what you think. If this code helps you out, let me
know,
and I'll throw it up somewhere.
--John
--
http://cjordan.us
[jQuery] Re: Announcement: Spoilers plugin
hi stephan,
this is a neat plugin, i see myself using this in some cases.
u mentioned that this functionality was there in imdb.com correct? where
exactly in that site can i get to see this feature?
-GTG
On 8/8/07, Stephan Beal [EMAIL PROTECTED] wrote:
On Aug 8, 6:28 pm, Stephan Beal [EMAIL PROTECTED] wrote:
For the click, i was thinking: clicking on the overlay will unhide the
text, and mouse-out will hide it again, but that might be tedious/
@Sam Dan:
i've added click-toggle and hoverIntent support via an optional init
parameter:
$('.jqSpoiler').initSpoilers({method:'click'});
$('.jqSpoiler').initSpoilers({method:'hoverIntent'}); // requires
hoverIntent plugin
The default is method:'hover'.
This doubled the MIN'd size of the code, though. It's now a whopping
424 bytes ;).
These features will be included in tomorrow's release. (i use the date
as the version number, and i've already made a release today, so i've
gotta wait another 5 hours [CET/GMT+1] before i can make a new
release ;).
You can have multiple types of spoiler revealing on one page by simply
using a marker class, like this:
// On-hover spoiler:
$('.jqSpoiler').initSpoilers();
// On-hover spoiler using hoverIntent plugin:
$('.jqSpoilerIntent').initSpoilers({method:'hoverIntent'})
.addClass('jqSpoiler');
// Clickable spoiler:
$('.jqSpoilerClick').initSpoilers({method:'click'})
.addClass('jqSpoiler');
The addClass() is used to ensure that the items marked with the marker
classes get the same CSS treatment.
[jQuery] Re: [Slight OT] Quick straw pole about maps
I never use Yahoo. I use Google for general quick maps and directions. I use http://local.live.com for the birds-eye-view. That view is ridiculously crazy. It sounds like a good idea to go for just one map source and make it more feature rich. Glen On 8/8/07, Tane Piper [EMAIL PROTECTED] wrote: Hey folks, I wanted to ask the list a quick straw poll. A bit OT but the subject is one of my plugins. I've just released version 1.4 of my plugin without much fanfair (http://code.google.com/p/jmaps) and I'm starting to think about the next version. I wanted to get an idea of what other people want, not just me. So a quick question is, especially to anyone using it is: What mapping service do you prefer? Google? or Yahoo? The reason I ask, is I can either keep the plugin on its current course of supporting both map services as equally as possible, or I can scale down or abandon the Yahoo support in going down the route of much more customisation for Google maps. For example, using jQuery syntax to make things such as custom icons, buttons and layouts more simple, as well as their services (geocoding, traffic info, map ads, etc). If you prefer Yahoo, let me know why. Thanks folks! -- Tane Piper http://digitalspaghetti.tooum.net This email is: [ ] blogable [ x ] ask first [ ] private
[jQuery] Re: [Slight OT] Quick straw pole about maps
As someone who has spent months, only moderately successfully, integrating Google Maps into a web app, I have two things to say: 1) Why is this the first I have heard of this plugin? I use jQuery throughout the site and would love to use it to handle some of my map duties. 2) I agree with Glen that focusing on one service is probably smarter in the long run. I much prefer Google, in part because of the way they handle driving directions, but also because of the interface customization possible. I feel like Google is more committed to their API than Yahoo. Thanks for your work on this. I might use it if I ever get around to version 2 of this app I built. /alex On 8/8/07, Glen Lipka [EMAIL PROTECTED] wrote: I never use Yahoo. I use Google for general quick maps and directions. I use http://local.live.com for the birds-eye-view. That view is ridiculously crazy. It sounds like a good idea to go for just one map source and make it more feature rich. Glen On 8/8/07, Tane Piper [EMAIL PROTECTED] wrote: Hey folks, I wanted to ask the list a quick straw poll. A bit OT but the subject is one of my plugins. I've just released version 1.4 of my plugin without much fanfair ( http://code.google.com/p/jmaps) and I'm starting to think about the next version. I wanted to get an idea of what other people want, not just me. So a quick question is, especially to anyone using it is: What mapping service do you prefer? Google? or Yahoo? The reason I ask, is I can either keep the plugin on its current course of supporting both map services as equally as possible, or I can scale down or abandon the Yahoo support in going down the route of much more customisation for Google maps. For example, using jQuery syntax to make things such as custom icons, buttons and layouts more simple, as well as their services (geocoding, traffic info, map ads, etc). If you prefer Yahoo, let me know why. Thanks folks! -- Tane Piper http://digitalspaghetti.tooum.net This email is: [ ] blogable [ x ] ask first [ ] private
[jQuery] Re: [Slight OT] Quick straw pole about maps
i have used google maps feature in quite a few applications now, and never once used yahoo... Regardless, i would say having one plugin per map provider sounds like a good choice. Later, you(or potentially another plugin author) can write another plugin for yahoo as well following a similar syntax as this plugin. This was the user can pick and choose the minimal code necessary for the task at hand. I guess, what i am trying to say is, we typically use one mapping or the other in an app, not both. So, having 2 separate plugins for 2 mapping providers sounds like a decent choice to me and google is a good place to start. -GTG On 8/8/07, Alex Ezell [EMAIL PROTECTED] wrote: As someone who has spent months, only moderately successfully, integrating Google Maps into a web app, I have two things to say: 1) Why is this the first I have heard of this plugin? I use jQuery throughout the site and would love to use it to handle some of my map duties. 2) I agree with Glen that focusing on one service is probably smarter in the long run. I much prefer Google, in part because of the way they handle driving directions, but also because of the interface customization possible. I feel like Google is more committed to their API than Yahoo. Thanks for your work on this. I might use it if I ever get around to version 2 of this app I built. /alex On 8/8/07, Glen Lipka [EMAIL PROTECTED] wrote: I never use Yahoo. I use Google for general quick maps and directions. I use http://local.live.com for the birds-eye-view. That view is ridiculously crazy. It sounds like a good idea to go for just one map source and make it more feature rich. Glen On 8/8/07, Tane Piper [EMAIL PROTECTED] wrote: Hey folks, I wanted to ask the list a quick straw poll. A bit OT but the subject is one of my plugins. I've just released version 1.4 of my plugin without much fanfair ( http://code.google.com/p/jmaps) and I'm starting to think about the next version. I wanted to get an idea of what other people want, not just me. So a quick question is, especially to anyone using it is: What mapping service do you prefer? Google? or Yahoo? The reason I ask, is I can either keep the plugin on its current course of supporting both map services as equally as possible, or I can scale down or abandon the Yahoo support in going down the route of much more customisation for Google maps. For example, using jQuery syntax to make things such as custom icons, buttons and layouts more simple, as well as their services (geocoding, traffic info, map ads, etc). If you prefer Yahoo, let me know why. Thanks folks! -- Tane Piper http://digitalspaghetti.tooum.net This email is: [ ] blogable [ x ] ask first [ ] private
[jQuery] Autocomplete
Hello, I found several autocomplete plugins on the jQuery site which do allow remote queries. Since there is too much choice maybe someone can tell me which one I should use ? Thanks -- Erik
[jQuery] Re: How to check input field
take a look at this link http://www.quirksmode.org/js/mailcheck.html -GTG On 8/8/07, Johny [EMAIL PROTECTED] wrote: In a form there is an input field where users insert their email address. How can I check if it is the valid email or that it consists `@' . Thank you for help L.
[jQuery] Re: tabs + jqmodal = bad things in IE6
Thanks Rob!
I reread the docs and got it work using the following:
$(#cssmizer)
// initialize CSSmizer
.cssmizer(settings)
// setup modal
.jqm({
trigger: #cssmizer-launch,
overlay:0,
// because tabs are being shown in a jqModal window which is
hidden by default
// we can only show the tabs *after* the window is shown
// otherwise we get oddities across browsers
onShow: function(hash) {
// we show the window using a speed of 1 to be as
instaneous as possible
// and for the tabs to render as fast as possible to avoid
flickering
hash.w.show(1, function() { $
(#container).tabs(); });
}
})
.jqDrag('h3.title');
Now if I could just figure out why the body of the window disappears
if you drag it around in IE... gotta be a CSS issue, hmm
[jQuery] Re: ClueTIP name=Title showing in IE.
On Aug 8, 2007, at 9:12 AM, Pops wrote:
Found a IE vs FF behavior difference. The A links are using
name=title attributes. In FF, they are not shown or atleast the
delay is shown that the AJAX results appears and the title tip does
not. In IE, it is always shown, so now you have two tips showing.
Thanks for bringing this to my attention!
It seems this line wasn't working in IE 6:
$cluetip.removeAttr('title')
So, I'll change it to this:
$cluetip.attr('title','')
Not sure why IE6 wasn't liking .remoeAttr(), but oh well.
You can take a look at the updated version at htttp://
test.learningjquery.com/clue/demo/
I wouldn't recommend using it in production, though, because it's
just my little test environment. I'm back to trying to fix some weird
problems with the drop shadows -- again in IE only -- and then I'll
look into the things you mentioned in the off-list email to me.
Thanks again for testing this stuff.
--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com
[jQuery] Re: Announcement: Spoilers plugin
thanks... -GTG On 8/8/07, Stephan Beal [EMAIL PROTECTED] wrote: On Aug 8, 8:30 pm, Ganeshji Marwaha [EMAIL PROTECTED] wrote: this is a neat plugin, i see myself using this in some cases. :) Michael Geary and Jay Salvat deserve the real credit. When i pointed out this effect a week or two ago they did the detective work to find out how it functions and posted the results in this forum. i simply took that and bundled it into a plugin. u mentioned that this functionality was there in imdb.com correct? where exactly in that site can i get to see this feature? Visit: http://imdb.com/title/tt0084787/faq and scroll way, way down, almost to the very bottom. You'll see red Spoilers! text (an image). Simply mouse-over. The effect is the exact same as this plugin.
[jQuery] Re: Autocomplete
Hi Erik, This is the one I've been using of late: http://bassistance.de/jquery-plugins/jquery-plugin-validation/ Rey Erik Colson wrote: Hello, I found several autocomplete plugins on the jQuery site which do allow remote queries. Since there is too much choice maybe someone can tell me which one I should use ? Thanks
