Re: [jQuery] New Forums
On Jan 21, 2010, at 8:11 PM, brian wrote: FWIW, I'm pretty sure the decision to drop Google Groups is due to John Ressig's account being spoofed by spammers. No, that's not it. Okay, maybe it was one of the last straws, but we've been talking about moving to a forum for a couple years now. If you want to know what factors were involved in the decision, please read http://jquery14.com/day-07/new-jquery-forum/ To be honest, I've never been a fan of forums, either. But after spending some time in the jQuery forum, I'm starting to appreciate its advantages over a plain mailing list. I wish there were a solution out there that is ideal for everyone. Unfortunately, though, every solution comes with its own set of compromises. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] New Forums
On Jan 22, 2010, at 12:54 PM, Octavian Rasnita wrote: With the web-based forum, while on the thread you want to email or link to 1. Click 'Permalink' I can't click because I can't use a mouse. I need to press probably tens of tab keys until I find that link, and if I type too fast I might skip it and need to tab over the same links for more times. And after I press enter on that link I would need to jump over more other page parts until I reach to the real body of the message. While most of the other complaints in this thread seem to be based on personal preference, this one is a serious issue. We have raised the issue of keyboard accessibility with the Zoho team, and they're working to ameliorate it. Oh yes it is, because a web page doesn't offer the same accessibility features for a screen reader as a desktop app does. And unfortunately most RSS readers also use a web format, so they are not better accessible at all. There are plenty of desktop RSS readers available for PC and Mac. --Karl
Re: [jQuery] Re: jQuery 1.4 and Broken UI Dialog Animations
yeah, I'm pretty sure jQuery UI 1.7.2 is not compatible with jQuery 1.4. The jQuery UI team are working on an update. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jan 19, 2010, at 3:51 PM, lloydphillips wrote: We've just had the same issue happen this morning. :(
Re: [jQuery] Actually deleting instead of .remove
Hmm. .remove() doesn't just hide an element; It removes it:
if ( this.parentNode ) {
this.parentNode.removeChild( this );
}
(from the source)
To prevent memory leaks, it also removes event handlers associated
with it. As of jQuery 1.4, it also removes data associated with it.
Maybe something else is going on? Or maybe something isn't being
caught. In any case, it might help to see a test case that shows the
memory leak. If you can reproduce the problem with a minimal test case
and post it publicly, send a note to the jquery-dev google group so
the devs can have a look.
thanks,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 12, 2010, at 6:52 PM, sophos707 wrote:
Hi everyone,
I'm running a script that processes text messages people send in, and
then it displays them on a screen. It will loop the text messages
when there are too many to show on one screen.
To accomplish this I add DIVs with a new ID for each new message. The
new messages push the old ones off the screen eventually. But when
this is the case the memory in the browser just keeps increasing to a
frightening load!
I tried using $(#MyDivId).remove() to get rid of the DIVs no longer
on the screen. Memory keeps increasing. Found out in this forum
that .remove() just hides an element in the DOM and makes in
inaccessible rather than actually deleting it.
How can we actually delete elements?
Thanks!
- Jeff
Re: [jQuery] Are numerical properties/indexes supported?
On Jan 13, 2010, at 9:24 AM, Nathan Klatt wrote: On Wed, Jan 13, 2010 at 2:03 AM, Dean deanpe...@gmail.com wrote: Any jQuery object currently has numerical properties/indexes that store references to the DOM node elements matched in the search. (E.g., $(div)[0] is a reference to the first matched DOM node element in the search.) Can we rely on these properties remaining in jQuery indefinitely? Every time $(div) is executed, it queries the DOM. If you want to save the results, save them: var divs = $(div). Then, access them in the documented way: divs.eq(0). If brackets work now, as they are not mentioned in the documentation then, no, you can't count on that working in the future. Nathan Actually, I'm going to go out on a limb and say that you can count on the array notation staying in jQuery. By the way, divs.get(0) and divs[0] return the DOM node, but divs.eq(0) still returns the jQuery object. Also, jQuery is not an array at heart, but an array-like object. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Re: Find array key of value
On Jan 12, 2010, at 7:32 AM, knal wrote:
@Brian
I have my images in an array (retrieved from the source, thanks for
the tip)
When i read the SRC from the current image, i want to know it's
location in the array.
This way i could either subtract 1 or add 1 to the current indexkey so
i know what image
was before or comes next.
Hope it's kind of clear, i don't completely know how to explain...
You could use $.inArray()
something like:
$.inArray('/some/src/value.jpg', imgSrc);
more info:
http://api.jquery.com/jQuery.inArray/
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] jQuery Form Processing
Your selector is for an ID: $('#autoSumForm')
But your form has no ID: form name=autoSumForm
action=posttime.php method=post
Try adding an ID to the form:
form name=autoSumForm id=name=autoSumForm action=posttime.php
method=post
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 12, 2010, at 9:49 AM, Seth wrote:
Hello,
I'm trying to use this method to process a form and return an alert
without navigating to a new page for the form processing.
http://jquery.malsup.com/form/#getting-started
I have this in my head statement:
script type=text/javascript src=js/jquery-1.3.2.js/script
script type=text/javascript src=js/jquery.form.js/script
script type=text/javascript
$(document).ready(function() {
$('#autoSumForm').ajaxForm(function() {
alert(Thank you for your comment!);
});
});
/script
And this is the form:
form name=autoSumForm action=posttime.php method=post
...
input type=submit name=submit id=submit value=Submit /
/form
When I click the submit button though, it takes me to posttime.php,
and doesn't give the alert.
What did I do wrong?
Re: [jQuery] Re: Specific type of menu action
You're trying to access the easing and lavalamp plugins at the wrong location, so they're returning 404 page not found errors. http://www.glenhealy.com/jquery.easing.min.js http://www.glenhealy.com/jquery.lavalamp.min.js Make sure those paths are correct and try again. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jan 12, 2010, at 10:20 AM, Glen_H wrote: was hoping someone can help me out. Than you andrei for the link. I have been messing around with it all morning and I think it should be working, but its not lol. maybe someone can find something that I oversaw. here is my site: www.glenhealy.com in firebug I am getting the error that the function is not a function, i put it in exactly how the plug in says to do it. is there something wrong with that maybe? thanks in advance to anyone who can help. On Jan 10, 2:03 pm, Andrei Eftimie k3liu...@gmail.com wrote: here is the site:http://www.webdesignblog.gr/archives/ at the top the menu and the way the hover slides from button to button, thats what I am trying to go for. anyone have any idea what it is called so I can look for a tutorial or plug in? Its called Lavalamphttp://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/ -- Andrei Eftimiehttp://eftimie.com +40 758 833 281 Puncthttp://designpunct.ro
Re: [jQuery] Download avatar 2009 for free
Really sorry. Someone was spoofing my email address. This has happened to a few others, too. Anyway, that account is banned now. On Jan 11, 2010, at 11:56 AM, Marc Henson wrote: Is there any chance you can stop spamming our group please? Cheers Marc On 11 Jan 2010, at 16:28, avatar3 wrote: Download avatar 2009 In the future, Jake, a paraplegic war veteran, is brought to another planet, Pandora, which is inhabited by the Na'vi, a humanoid race with their own language and culture. Those from Earth find themselves at odds with each other and the local culture. Download avatar 2009
Re: [jQuery] Download jQuery API docs
The new 1.4 documentation is available as a raw XML file: http://api.jquery.com/api/ That probably isn't what you want, though. Here is a page with links to alternative resources: http://docs.jquery.com/Alternative_Resources Also, you can download an Adobe Air app for jQuery 1.3 API: http://api.jquery.com/browser/ --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jan 9, 2010, at 9:27 AM, MISS_DUKE wrote: Is it possible to download the jQuery API documentation to my local hard-drive? If so, I don't need to connect the Internet every time when I want to refer the API docs.
Re: [jQuery] Re: Change opacity of item with class of selected
If you're concerned about it validating, use a conditional comment to
include an IE-only stylesheet with the filter in it. At least your non-
IE stylesheets will validate.
Also, note that for IE8, you'll need to use -ms-filter. So, in your IE
stylesheet, you'll have this:
#thumbs li.selected {
-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
filter:alpha(opacity=50);
}
They have to be in that order, too, apparently. for more information,
see:
http://www.quirksmode.org/css/opacity.html
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 6, 2010, at 7:17 AM, Paul Collins wrote:
That works Johan, thanks very much.
Doesn't validate, but I guess that's not the end of the world...
Thanks again.
Paul
2010/1/6 Johan Borestad johan.bores...@gmail.com
Hi Paul!
This is a case where you really don't even should use Javascript,
unless you're trying to do some fancy animations. Rely entirely on CSS
with a simple css-rule
#thumbs li.selected {
filter:alpha(opacity=50);
opacity:0.50;
}
This will also be much much faster than any other solutions.
/ Johan
On Jan 5, 7:50 pm, Paul Collins pauldcoll...@gmail.com wrote:
Sorry, the test page:http://paulcollinslondon.com/test/test.html
2010/1/5 Paul Collins pauldcoll...@gmail.com
Thanks very much for your help Brian. That works, but I think
the problem
may go deeper than I thought! I've put up a test page.
I'm using the JQuery Opacity Rollover Script as a part of the
Gallerific
plugin http://www.twospy.com/galleriffic/#1
To try and keep this simple, when you hover over a thumbnail, it
originally
went from dark to light. I've reversed the order of this in
mouseOutOpacity mouseOverOpacity on the scripts.js
jquery.opacityrollover.js, so now they are full opacity by
default and half
when you hover over. There is a selected class applied when you
click on a
thumbnail and I want to make the opacity stay at half when you
click on it.
There seems to be a default on all list items of the thumbs ul
of
opacity: 1; I want to change it to 0.5 when an item has a class
of selected,
but can't get it to work.
I've tried removing the inline style first using
$(#portfolio #thumbs li.selected).removeAttr(style);
But this doesn't work.
Sorry for the long windedness of this post, but if anyone could
even give
me a hint of where to start looking, I would be really grateful.
Thanks
2010/1/5 brian zijn.digi...@gmail.com
Just put the class in the selector instead of testing for it
first:
$(#portfolio #thumbs li.selected).css('opacity','0.5');
If the class doesn't exist, jQuery will do nothing (instead of
throwing an undefined error or similar).
On Tue, Jan 5, 2010 at 12:45 PM, Paul Collins
pauldcoll...@gmail.com
wrote:
Hi all
I've been stuck on this for four hours, and I still can't
solve it!
I am trying to check if a list item has a class of selected,
then is so
change the opacity to 0.5. Here is my code:
if ($(#portfolio #thumbs ul li).hasClass(.selected)) {
$(this).css('opacity','0.5');
}
It seems that the this part isn't working, is it to do with
putting it
in
an event?
Would appreciate any help
Re: [jQuery] XPath for Attribute Selection Criteria
On Jan 6, 2010, at 10:13 AM, Richard Collette wrote:
The jQuery documentation states that it uses a combination of both CSS
and XPath selectors.
Does that mean that I should be able to select attributes using the
syntax:
[attName=Val1 or attName=val2]
since XPath criteria allow OR's like this?
If not, exactly what parts of XPath are supported?
Earlier versions of jQuery supported a mix of CSS 1-3 and a subset of
XPath, but the XPath selector syntax support has been removed for
quite some time. Can you please point me to the URL in the
documentation where it says that both are supported so I can correct it?
To answer your question, this should work:
$('[attName=Val1], [attName=val2]')
I'd put something (like a tag name) before each of those attribute
selectors, though. For example:
$('input[attName=Val1], input[attName=val2]')
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] How to unsubscribe from this group?
On Jan 5, 2010, at 7:47 PM, Chikkis Corner wrote: Please unsubscribe me from this group. Hi, The following instructions are paraphrased from: http://groups.google.com/support/bin/answer.py?hl=enanswer=46608 You can unsubscribe from a group through the web interface or via email. To unsubscribe through the web interface, just click the Edit my membership link on the right-hand side of the group's homepage at http://groups.google.com/group/jquery-en/ . Then click the Unsubscribe button on the page that appears. To unsubscribe via email, send an email to jquery-en+unsubscr...@googlegroups.com --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Re: retrieving textnode?
You can't apply CSS to a text node, but you can find the text node,
wrap it in a span, and then apply the css to that span. This should
work:
$('div p').contents().filter(function() {
return this.nodeType == 3 this.nodeValue.indexOf('certain
string') -1;
}).wrap('span/').parent().css('color', 'red');
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 5, 2010, at 5:59 PM, bundy wrote:
I'm trying to avoid classes and ids if possible. If I have to use them
I won't really need jQuery.
What about something like
var six = $(div p::nth-child(6)
and then
for (i=0; isix.length; i++) {
if (six.item(i).textNode) == _ _ ) {
six.item(i).style.color = red }
?
On Jan 6, 3:04 am, brian zijn.digi...@gmail.com wrote:
CSS only operates on tagged elements. You'll have to wrap the text
node in a span (with a certain class, for example).
On Tue, Jan 5, 2010 at 2:00 AM, bundy ctil...@hinet.net.au wrote:
Hi, I'm new to jQuery, finding feet.
I want to be able to say, if the text node of a certain child
consists of certain string, do this with its css.
Gotten as far as changing the css of all the children, thus:
$(document).ready(function(){
$(div p::nth-child(6).css(color, red);
});
but
$(document).ready(function(){
$(div p::nth-child(6).textNode(_ _).css(color, red);
});
doesn't do it. Nor does textNode=...
Second question, Firefox error console isn't muchhelp in
interpreting
the error. Any suggestion for debugging?
Re: [jQuery] Re: How to check whether an element is bound to an event or not?
In jQuery 1.3.x, .live() only works for a subset of event types.
jQuery 1.4 extends support to all event types:
Possible event values: click, dblclick, mousedown, mouseup,
mousemove, mouseover, mouseout, keydown, keypress, keyup
Currently not supported: blur, focus, mouseenter, mouseleave,
change, submit
http://docs.jquery.com/Events/live#typefn
Kudos for rolling your own solution for 1.3.x with the onfocusin event.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 3, 2010, at 5:31 AM, Md. Ali Ahsan Rana wrote:
I don't know about this much. But, just a while ago, i wa having
problem binding focus event with live() method. Just solved it by
the following code that i found somewhere on internet:
(function(){
var special = jQuery.event.special,
uid1 = 'D' + (+new Date()),
uid2 = 'D' + (+new Date() + 1);
jQuery.event.special.focus = {
setup: function() {
var _self = this,
handler = function(e) {
e = jQuery.event.fix(e);
e.type = 'focus';
if (_self === document) {
jQuery.event.handle.call(_self, e);
}
};
jQuery(this).data(uid1, handler);
if (_self === document) {
/* Must be live() */
if (_self.addEventListener) {
_self.addEventListener('focus', handler, true);
} else {
_self.attachEvent('onfocusin', handler);
}
} else {
return false;
}
},
teardown: function() {
var handler = jQuery(this).data(uid1);
if (this === document) {
if (this.removeEventListener) {
this.removeEventListener('focus', handler, true);
} else {
this.detachEvent('onfocusin', handler);
}
}
}
};
jQuery.event.special.blur = {
setup: function() {
var _self = this,
handler = function(e) {
e = jQuery.event.fix(e);
e.type = 'blur';
if (_self === document) {
jQuery.event.handle.call(_self, e);
}
};
jQuery(this).data(uid2, handler);
if (_self === document) {
/* Must be live() */
if (_self.addEventListener) {
_self.addEventListener('blur', handler, true);
} else {
_self.attachEvent('onfocusout', handler);
}
} else {
return false;
}
},
teardown: function() {
var handler = jQuery(this).data(uid2);
if (this === document) {
if (this.removeEventListener) {
this.removeEventListener('blur', handler, true);
} else {
this.detachEvent('onfocusout', handler);
}
}
}
};
})();
--
http://ranacseruet.blogspot.com/
Re: [jQuery] Re: simple jquery question
this solution could be simplified a bit:
$('h3.example').each(function() {
$('#deptFilter').append( 'option' + $(this).html() + '/option' );
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 3, 2010, at 6:53 AM, Paul Hutson wrote:
This will do what you want, first I assigned the elements via a
filter :
elements = $('h3').filter('.example');
Then I scrolled around the items found and output them to a span for
debugging.
elements.each(function() {
$('#Output').html($('#Output').html() + br + $(this).html());
});
Here's the entire test code :
html
head
script type=text/javascript
src=http://ajax.googleapis.com/ajax/
libs/jquery/1.3/jquery.min.js/script
script type=text/javascript
$(document).ready(function(){
elements = $('h3').filter('.example');
elements.each(function() {
$('#Output').html($('#Output').html() +
br + $(this).html
());
});
});
/script
/head
body
h3 class=example
LALALA
/h3
h3 class=notexample
NOT example :)
/h3
h3 class=example
Blub
/h3
brbr
span id=Output
/span
/body
/html
On Jan 2, 8:25 pm, jason jasona...@gmail.com wrote:
Hey,
was wondering if anyone could help me with a basic JQ question. Ok so
I am trying to select each element that has a certain class on my
page, and then use what is inside of the h3 class=example I am
selecting to populate a drop down select box with the id of
deptFilter. (with each result found inside of the H3, wrapped in
option tags.) I am having trouble understanding how I actually
store
the variables found in each H3 with the class of example.
Any help would be greatly appreciated.
Re: [jQuery] Sentence Case?
You could try something like this:
function sentenceCase(str) {
// callback function for regex replace
var replacer = function(match, endmark, cap) {
if (endmark) {
return endmark + cap.toUpperCase();
} else {
return match.toUpperCase();
}
};
return str
.replace(/^[a-z]/, replacer)
.replace(/([.!?]\s+)([a-z])/g, replacer);
}
// convert to sentence case on keyup in text inputs.
$('input:text').keyup(function() {
this.value = sentenceCase(this.value);
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Jan 3, 2010, at 11:35 PM, dmikester1 wrote:
I can't find any jQuery plugin or even code that will do Sentence Case
in a input field onkeyup. Does anyone know how I can do this?
Thanks
Mike
Re: [jQuery] Need jQuery expert to slightly modify plugin
I also have an enhanced version of the jCarouselLite plugin that you are free to use: http://github.com/kswedberg/jquery-carousel-lite --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jan 4, 2010, at 10:19 AM, Liam Potter wrote: http://groups.google.com/group/jquery-en/browse_thread/thread/f550b94914d10065 On 04/01/2010 15:12, MikeTheVike wrote: I'm using the newest version of jQuery(http://www.jquery.com) and the jCarousel Lite plugin (http://www.gmarwaha.com/jquery/ jcarousellite/). It is a content slider that rotates content slides. It is setup to auto rotate on a set time, and you can also hit the previous/next buttons to move through the slides. This has been working great. Now I have the need for a pause button that will stop the auto rotate. I think this should be fairly easy for someone familiar with javascript and jQuery. Please email me at mike (at) moxiedisplays (dot) com. This is a paid job if we can find someone to do it correctly and in a timely manner. Thanks!
Re: [jQuery] Re: Help on Independent DIV's that toggle!!
Šime,
Sorry, but I agree with Scott for the most part.
On Jan 1, 2010, at 10:55 AM, Šime Vidas wrote:
So, you are:
1. going against the standard (misusing the A)
Easily solved by adding a hash identifier:
pa id=slick-toggle href=#content1More Details/a/p
div id=content1
pAdditional content/p
pMore additional content/p
pStill more additional content/p
/div
Now it's a perfectly acceptable use.
2. setting an invalid URI to the href attribute
I'm having a hard time finding that in the spec. Can you provide a
link? (that's a genuine request.)
Anyway, you're inflating the number of problems here. Numbers 1 and
2 should be a single item.
3. doing 2 additional steps (setting href and returning false in
handler)
too lazy? ;-) see your comment below.
4. taking the risk that you will at one occasion forget to return
false in the handler which would mess up the Back button for the user
Or call event.preventDefault()
It's a risk I'm willing to take.
just because you are to lazy (no offense) to put this in your CSS
code:
.slick-toggle { color:blue; text-decoration:underline; }
.slick-toggle:hover { cursor:pointer; }
But, chances are that you will have to style the slick-toggle class
anyway (because blue underlined text with everything else inherited
doesn't bring it anyway in most cases).
You've also overlooked an important reason for using an a
href=#foo (or a button) rather than a span or some other element:
Keyboard accessibility. I suppose you could play around with tabindex
attributes, but that gets thorny pretty quickly. Besides, at least
according to the html 4.01 spec, only a limited set of elements
support the tabindex attribute:
The following elements support the tabindex attribute: A, AREA,
BUTTON, INPUT, OBJECT, SELECT, and TEXTAREA.
http://www.w3.org/TR/html401/interact/forms.html#adef-tabindex
(Seems some browsers actually support a broader set of elements, but I
haven't investigated this much.)
So, with span elements you're left with no valid way to navigate to
them and invoke them with a keyboard. That's a pretty serious
limitation -- one that I think far outweighs the concerns that you've
raised about a href=#.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] Re: jQuery does not stripe visible table rows correctly
On Jan 1, 2010, at 3:53 PM, Michael Geary wrote:
I wouldn't use either version.
Instead, I would change your CSS from:
tr.rowodd { background-color: #FFF; }
tr.roweven { background-color: #F2F2F2; }
to:
tr { background-color: #FFF; }
tr.roweven { background-color: #F2F2F2; }
and then use just one line of jQuery code:
$('#foobar tr:visible:odd').addClass('roweven');
Now you're doing only half the work and letting the CSS cacading
rules take care of the rest.
And if you need to support IE6, you might have trouble applying a
background-color to a tr (I seem to recall having that problem in
the past). If you do, you could do this instead:
tr td { background-color: #FFF; }
tr.roweven td { background-color: #F2F2F2; }
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] slow pop-up on IE8
Yes, there is something in jquery.cluetip that will cause this. It binds event handlers to every single element you specify in the selector. The clueTip plugin is not a viable solution for thousands of tooltips on a page. I recently wrote a series of posts on learningjquery.com about one way to handle such a large number of tooltips. Here is the latest n the series: http://www.learningjquery.com/2009/12/using-settimeout-to-delay-showing-event-delegation-tooltips --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 31, 2009, at 8:04 AM, Tarha Kettunen wrote: Hello If I have lot off (3000) pop-ups on single page, IE8 will freeze. Firefox is doing fine. Is there something in jquery.cluetip.js that could cause this, or should I contact Microsoft?
Re: [jQuery] Documentation for ~= selector
thanks for reporting that. We are currently working on a brand new documentation system for jQuery 1.4, and ~= will be in there for attribute selectors. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 29, 2009, at 4:33 AM, akzhan wrote: Hello, Take a note that jQuery documentation is incomplete (http:// docs.jquery.com/Selectors). Well known CSS3 selector ~= (http://www.w3.org/TR/css3-selectors/ #selectors) is not documented there. This selector supported by jQuery 1.3. With best wishes, Akzhan.
Re: [jQuery] Re: Documentation for ~= selector
the rel attribute, for one. --Karl On Dec 29, 2009, at 11:59 AM, Šime Vidas wrote: Is there a attribute other then the class attribute where you have a space-seperated list of values? If not, the *= should be good enough.
Re: [jQuery] Re: Finding next element
You can't just use .prev() or .next() because the links are within
list items. Instead, you'll need to do something like this:
$('a.active').parent().prev().find('a')
and this:
$('a.active').parent().next().find('a')
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 27, 2009, at 8:50 PM, Ami wrote:
$('.active').prev()
$('.active').next()
Rate me please if I helped.
On Dec 28, 2:30 am, Toaster mr.toas...@gmail.com wrote:
Hello.
Example:
ul
lia/li
lia class=active/li
lia/li
/ul
How would I be able to get find the next or previous a in relation
to the a class=active?
I'd appreciate it if anybody could help me out with this. Thanks in
advance.
Re: [jQuery] Re: I would like to get value each time when one of these checkboxes will change status, how can I do that ?
You don't need to use the change event. The click event is also
triggered by the keyboard. When the checkbox has focus, press the
spacebar and see what happens.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 27, 2009, at 11:26 PM, Charlie Griefer wrote:
Wow. Never even thought about that, but it makes perfect sense.
Thanks for pointing that out :)
On Sun, Dec 27, 2009 at 5:52 PM, Ami aminad...@gmail.com wrote:
I recommend to use change event and not click event, becuase users
can change the checkbox without clicking (by using the keyboard).
On Dec 28, 1:17 am, Charlie Griefer charlie.grie...@gmail.com wrote:
You just want the value of the one that's checked?
$(':checkbox[name=number]').click(function() {
if ($(this).is(':checked')) alert($(this).val());
});
if you want the total of all checked boxes when one is clicked:
script type=text/javascript
$(document).ready(function() {
$(':checkbox[name=number]').click(function() {
var total = 0;
$(':checkbox[name=number]:checked').each(function() {
total += parseFloat($(this).val());
});
alert(total);
});
});
/script
On Sun, Dec 27, 2009 at 1:08 PM, dziobacz
aaabbbcccda...@gmail.com wrote:
I have:
input type=checkbox checked=checked value=2 name=number/
input type=checkbox value=7 name=number/
input type=checkbox value=34 name=number/
I would like to get value each time when one of these checkboxes
will
change status, how can I do that ? For example when first checkbox
will be unchecked or second will be checked. Could You help me ?
--
Charlie Grieferhttp://charlie.griefer.com/
I have failed as much as I have succeeded. But I love my life. I
love my
wife. And I wish you my kind of success.
--
Charlie Griefer
http://charlie.griefer.com/
I have failed as much as I have succeeded. But I love my life. I
love my wife. And I wish you my kind of success.
Re: [jQuery] Re: jQuery website search function
On Dec 23, 2009, at 2:29 AM, RobG wrote:
On Dec 22, 10:51 pm, Schalk Neethling volume4.sch...@gmail.com
wrote:
Hi there,
I was wondering whether anyone knows if the jQuery website has some
sort
of API to access the search functionality of the site?
Stimulus, response...
form action=
div
input type=text name=queryText value=events
input type=button value=Search... onclick=
searchDocs(this.form.queryText);
/div
/form
script type=text/javascript
function searchDocs(el) {
document.location =
'http://docs.jquery.com/Special:Search?ns0=1search='
+ encodeURIComponent(el.value)
+ 'go=';
}
/script
interesting that you would put an onclick on the input rather than an
onsubmit on the form. any particular reason for that?
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] Re: Get the selected text and border it with tags
On Dec 20, 2009, at 5:21 PM, Šime Vidas wrote: Say, we have an input box or a textarea. There are two words selected. I need to make them italic (i/i) if a button is clicked. You want to put i elements inside input type=text / or textarea ? That's not possible... input is an empty element, and textarea only accepts character data.. I think he just wants to put those characters in the actual textarea or input. Andre, for this sort of thing, I highly recommend the jQuery MarkItUp plugin: http://markitup.jaysalvat.com/ --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Jquery does not work in IE8
If I view source on the detail frame, I see that you're referring to
the $ function before you load the jQuery file. Put the script element
that loads jQuery before your other script and see if that helps.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 17, 2009, at 4:26 AM, blueshift wrote:
Jquery-1.3.2. runs fine in Safari and Firefox. In IE8 (using the
Developer Tools), I get the error: Could not get the position
property. Invalid argument jquery-1.3.2.js, line 12 character 12949.
Using debugging, the script highlights the characters {J[G]=K}.
I have no idea what this does, but it seems to cause the problem! The
result is when a thumbnail image is clicked in one of my galleries,
the image does not open in IE8. If anyone understands this or how to
correct it, I'd be very grateful!
See the problem in action (or not) on my website: www.blueshiftgallery.com
(click on a gallery to open the thumbnails).
Many thanks!
Re: [jQuery] Re: Document traversing with jQuery + HTML 5 drag and drop
I'm sorry nobody has responded to you yet. I'm not terribly familiar with HTML5 drag and drop, but this article made me a little wary (warning to gentle souls: lots o' cussing in there): The HTML5 drag and drop disaster http://www.quirksmode.org/blog/archives/2009/09/the_html5_drag.html You might have a better chance of getting help with your issue if you posted to the jquery-ui group. The devs there are likely to have had more experience with HTML5 drag and drop, even though I wonder why you wouldn't just use jQuery UI's .draggable() and .droppable() methods in the first place. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 15, 2009, at 7:55 AM, eid wrote: No one? On Dec 10, 8:37 pm, eid php...@gmail.com wrote: Hello. I am coding some HTML 5 drag and drop support where the user can drag images from a library to a textarea, and the necessary HTML to include the image will then be added. The addition of the html is done through a function that takes a li element as an argument and then does the rest. The problem is that the drag and drop of any image results in the first li being sent to the function so clearly there's something wrong with my document traversing. Please take a look at the code below: The HTML can be seen here:http://hb.pastebin.com/m28f90fc8 And the relevant JavaScript is here:http://hb.pastebin.com/m1cf6fec1 If I drag 2.JPG.thumbnail.jpg to the textarea it should add the HTML for the 2.jpg but it doesn't, it adds 1.jpg - So var asset = event.parentNode; in the JS gets the wrong element. Any ideas how to fix it? Thanks
Re: [jQuery] a problem when using django template and jquery
are you sure that the tr IDs are being rendered in the right order?
View source to double check. If they are correct in the html, could
you point us to a test page where you're experiencing the problem?
thanks,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 15, 2009, at 3:47 AM, elprup wrote:
hello guys, I use django template to generate a HTML like this:
{% for type in types %}
tr id=list_{{type.id}} class=itemrow
td width=70 align=middle class=list_typename
{{type.name}}/td
/tr
{% endfor %}
typeid increases from 1 by 1.
I use class traverse to get the sequence of the list:
sendstr = ;
$(.itemrow).each(function(index, value) {
type = $(this).attr('id').substring(5);
sendstr += type;
});
I expect sequence to be like 12345, but the result is 13254. I'm
confused.
Can anyone help me. Thanks
Re: [jQuery] Position()
On Dec 10, 2009, at 12:39 PM, Paulodemoc wrote: Hello guys, i started another thread about the FullCalendar plugin, and I've noticed what's happening. The css 'top' and 'left' properties from the css aren't being calculated properly... The functions to calculate that uses the 'position()' function of jquery, but it is always returning 0, 1 or -1, no matter where the element is on the page... Does anyone know if this is some jquery bug or something? Might you be looking for .offset() instead? --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Re: load() function and IE8
I'm not familiar with the Admintasia template. If #AP_PONum is in the
DOM when you bind the event handler, then you shouldn't need live.
It's only one element, so there shouldn't be a performance hit either
if you just use bind. The only reason .bind() wouldn't work is if
#AP_PONum isn't in the DOM when you call it (or if you later remove
#AP_PONum and then add an element with id=AP_PONum later).
Given those caveats, this should work:
$(#AP_PONum).bind(change, function(){
ap_po = $(this).val();
$(#content-box)
.load(webapps/finished_jewelry/PurReq/display/
dsp_addPurchaseRequest.cfm?poNum=+ap_po);
});
If that still doesn't work for you, we'd be able to help more
effectively if we could see if a test page somewhere.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 14, 2009, at 9:41 AM, Scott Stewart wrote:
working and supported are two different animals
This is true...
Back to my particular anomaly...
I just replaced the live call with a bind call, and now there's
nothing
in Firefox either..
I'm using the Admintasia template
(http://www.admintasia.com). Because of the way this is set up (or
the way
that I'm calling things) I've had to use the live function to get
things to
work.
I think I'm right in assuming that the live function keeps the
Ajax events
alive...
So is there a way to get around this? I can always add a submit
button to
every dropdown I'm using but that would kind of defeat the purpose.
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com]
On
Behalf Of MorningZ
Sent: Monday, December 14, 2009 9:10 AM
To: jQuery (English)
Subject: [jQuery] Re: load() function and IE8
But if it's not supported then why would it work in Firefox?
working and supported are two different animals
And it works because the change event does bubble events the way
that works with .live(), and, no surprise here, IE doesn't bubble
events the way that works with .live() but apparently some way
around IE's shortcomings is in place for 1.4's implementation of
.live
()
On Dec 14, 8:56 am, Scott Stewart sstwebwo...@bellsouth.net wrote:
Thanks Karl,
But if it's not supported then why would it work in Firefox?
Secondly, would the bind method be a workaround?
Thanks
sas
-Original Message-
From: jquery-en@googlegroups.com [mailto:jquery-
e...@googlegroups.com] On
Behalf Of Karl Swedberg
Sent: Monday, December 14, 2009 12:33 AM
To: jQuery (English)
Subject: [jQuery] Re: load() function and IE8
Hi Scott,
Take a look at the documentation for the .live() method:
Currently not supported: blur, focus, mouseenter, mouseleave,
change,
submit
http://docs.jquery.com/Events/live#typefn
The change event doesn't bubble in IE, so it doesn't work with .live
(). jQuery 1.4 is going to provide a workaround for that, but as of
1.3.2, it's not supported.
On Dec 10, 5:02 pm, Scott Stewart sstwebwo...@bellsouth.net wrote:
I fat fingered the last one so...
I have this piece of code
$(#AP_PONum).live(change, function(){
ap_po = $(option:selected,this).val();
$(#content-box).load(webapps/finished_jewelry/PurReq/display/
dsp_addPurchaseRequest.cfm?poNum=+ap_po);
});
which works like a champ in firefox.
it's called from a drop down grabs the ColdFusion template and
load it
in a div called content-box.
This does nothing in IE8, no error, no load, no love.. nothing
any ideas on how to work around this?
Re: [jQuery] how to get value between brackets in a string
to elaborate a bit, you could store the result of that line in a
variable and then use it.
I'd do the replace a bit differently.
var n = $('#pageCount').text().replace(/[)(]/g,'');
or use .match instead:
var n = $('#pageCount').text().match(/\d+/)[0]
Now you can do something with n.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 14, 2009, at 7:48 AM, Leonardo K wrote:
$('#pageCount').text().replace(')','').replace('(','')
On Mon, Dec 14, 2009 at 10:41, tony stamp tonyst...@hotmail.co.uk
wrote:
I have a simple span element with the id of pageCount, which has a
value of
(5), for example. I am attempting to get the just number value
without the
brackets, or some way of adjusting the number and leaving the
brackets. Any
pointers?
--
View this message in context:
http://old.nabble.com/how-to-get-value-between-brackets-in-a-string-tp26777141s27240p26777141.html
Sent from the jQuery General Discussion mailing list archive at
Nabble.com.
[jQuery] Re: load() function and IE8
Hi Scott,
Take a look at the documentation for the .live() method:
Currently not supported: blur, focus, mouseenter, mouseleave, change,
submit
http://docs.jquery.com/Events/live#typefn
The change event doesn't bubble in IE, so it doesn't work with .live
(). jQuery 1.4 is going to provide a workaround for that, but as of
1.3.2, it's not supported.
On Dec 10, 5:02 pm, Scott Stewart sstwebwo...@bellsouth.net wrote:
I fat fingered the last one so...
I have this piece of code
$(#AP_PONum).live(change, function(){
ap_po = $(option:selected,this).val();
$(#content-box).load(webapps/finished_jewelry/PurReq/display/
dsp_addPurchaseRequest.cfm?poNum=+ap_po);
});
which works like a champ in firefox.
it's called from a drop down grabs the ColdFusion template and load it
in a div called content-box.
This does nothing in IE8, no error, no load, no love.. nothing
any ideas on how to work around this?
Re: [jQuery] Cluetip and Colorbox - Can I make them work together?
try using the onShow option.
$('a.jt').cluetip({
cluetipClass: 'jtip',
dropShadow: false,
hoverIntent: true,
sticky: true,
mouseOutClose: true,
positionBy: 'fixed', leftOffset: -235, topOffset: -190,
onShow: function(ct) {
ct.find(a.modal).colorbox();
}
});
that might do it
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 11, 2009, at 4:20 PM, necker47 wrote:
Hello,
I'm using Cluetip to pull some AJAX content, and in that content is a
link to another small bit of AJAX content. Since Cluetip doesn't seem
to support multiple tips (http://groups.google.com/group/jquery-en/
browse_thread/thread/b853977ee373b1ee), I was trying to use something
like Colorbox to throw up a quick modal (it has to hit the page to
activate a process and then show a message), but the modal doesn't
want to fire presumably because I'm trying to activate it from that
original AJAX page. I'm just curious if something like this is even
possible. I'm just using the basic syntax right now:
$(document).ready(function() {
$('a.jt').cluetip({
cluetipClass: 'jtip',
dropShadow: false,
hoverIntent: true,
sticky: true,
mouseOutClose: true,
positionBy: 'fixed', leftOffset: -235, topOffset: -190
});
});
and
$(document).ready(function(){
$(a.modal).colorbox();
});
It's also entirely possible that I'm not using the AJAX appropriately
either, so any ideas or help would be greatly appreciated!
Re: [jQuery] Selectors and Internet Explorer
Hi Rob, According to Microsoft's HTML and DHTML Reference, IE's onclick event (as well as others) doesn't apply to the option element: http://msdn.microsoft.com/en-us/library/ms536913%28VS.85%29.aspx --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 10, 2009, at 3:53 PM, rob wrote: I'm having some problem with selectors in Internet Explorer. I have this demo setup that is basically a modified linked menus application. When you select something from one menu, it updates the contents in it's child menu. For some reason Internet Explorer will not read the correct selector. I have tested the following: I've tried each of these selectors with and without this. $(.parentMenu).click(); $(#parentMenu .parentMenu).click(); $(#parentMenu option).click(); This was the only one I got to trigger anything. $(#parentMenu).click(); The elements in question here are: select class='selectMenu' id='parentMenu' option class='parentMenu' /select My question is: Why do all the other browsers recognize the content within the select except internet explorer. It seems like it won't call any of the option elements, whether they're created by script or loaded fresh from the server. Any ideas??
Re: [jQuery] Re: Content loaded via Ajax and global JS
On Dec 5, 2009, at 10:47 AM, John Imbong wrote: Yes, the live function should do it. In case that still won't work for you, just work up the vine and install the plugin livequery instead, which is where live came from. John Actually, the .live() method didn't come from the livequery plugin. That plugin uses an altogether different approach: Rather than rely on event delegation, livequery listens for changes to the DOM. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Changing background color of table cells
I'd try something like this:
$('#Directorships td:nth-child(1)').filter(function() {
return $(this).text() == 'D';
}).addClass('bgHighlight');
Change the 1 in :nth-child(1) to whatever column you want. nth-child
is 1-indexed, so the first cell in a row would be :nth-child(1), the
second :nth-child(2) and so on.
If it's the first or last column that you want highlighted, you could
use :first-child or :last-child, respectively.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 5, 2009, at 12:50 PM, evanbu...@gmail.com wrote:
I have a table with an id of Directorships and I want to add the class
bgHighlight to any cell with a value of 'D'. This code below works
fine for an entire table but I just want to apply this logic to a
single column of the same table rather than the whole table. Thanks.
$('#Directorships tr').each(function() {
$('td', this).each(function() {
if ($(this).text() == D)
$(this).addClass(bgHighlight);
});
});
Re: [jQuery] Re: Why mootools animations is more smooth than jquery?
Just out of curiosity, which browser are you using? Did you try it in more than one? --Karl On Dec 4, 2009, at 9:43 AM, donb wrote: I have a 'slow computer' that is 6 years old hardware, has been upgraded from windows 3.1 and upward, to the current XP without ever a wipe and reinstall. I figure I'm a worst-case scenario if there ever was one. ;-) I routinely find pages loading extremely slow from javascript-intense sites. But these test cases run equally-smooth with jquery or mootools, for me. I would throw out another possibility here - the particular javascript engine that the browser is using. Might want to check that. (NOTE: I just tried to figure out what version I am using, but danged if I can find anything that tells me what version it is. Give me a pointer what to look for and I'll look again if you want me to). On Dec 4, 5:54 am, wshawn sh...@sanityllc.com wrote: Celeron? BAH! They need to kill that beast. In openSuse, on a not so slow machine ;) running KDE, Firefox 3.5.5 with only the cookie monster plugin activated, I noticed a slight lag in the mootools sample. Some of this perceived speed difference may be a direct result of plugins, or proxy issues in the browsers themselves. The biggest noticeable changes were 2 to 3 and 4 to 1.The direct vertical and horizontal slides were fine in both jQuery and Mootools. On Dec 4, 4:06 am, Jonathan Vanherpe (T T NV) jonat...@tnt.be wrote: That's why I said you needed to find a slow computer to test it on ;-). We need to cater to a diverse audience, and part of that audience is using IE6 on a crappy Intel Celeron chip or Firefox on a G4. Jonathan Michel Belleville wrote: Just used your benchmark and I didn't see any significant differences. Both had slight jumps from time to time, none felt like there was a pattern, I'm using Firefox 3.5 on a iMac pro (last year's edition) running snow leopard. Michel Belleville 2009/12/4 Jonathan Vanherpe (T T NV) jonat...@tnt.be mailto:jonat...@tnt.be Karl Swedberg wrote: On Dec 3, 2009, at 7:31 PM, Dave Methvin wrote: I refrained from replying because the OP seemed trollish, but he has a point, IMHO. It would be great if someone who knew both frameworks could set up a page that demonstrated a side-by-side case where Mootools has smoother animations than jQuery. Otherwise it's hard do know what might be causing the problem, or even whether there's a problem at all. That's a great idea, Dave. I wonder how much the easing equation affects people's perception of smoothness. It might be worthwhile to try animations using the easing plugin and see if any of those equations feel smoother. --Karl Karl Swedberg www.englishrules.comhttp://www.englishrules.com www.learningjquery.comhttp://www.learningjquery.com ok, I've used some code I had lying around and put dummy content in there: http://www.tnt.be/bugs/jquery/moovsjquery/ I actually don't really see a difference on my Ubuntu box (using FF 3.6b4), but there's a huge difference on a colleague's G4 (OS X 10.4, Firefox 3.5.5), so try to find a slow computer to test this on. Again, this might be the fault of the plugin I'm using, if you have another way of doing the same thing in jQuery you can tell me so I know for next time. I really prefer using jQuery, but sometimes I just can't because of things like this. Jonathan -- www.tnt.behttp://www.tnt.be/?source=emailsig *Jonathan Vanherpe* jonat...@tnt.be mailto:jonat...@tnt.be -www.tnt.be http://www.tnt.be/?source=emailsig - tel.: +32 (0)9 3860441 --www.tnt.behttp://www.tnt.be/?source=emailsig *Jonathan Vanherpe* jonat...@tnt.be mailto:jonat...@tnt.be -www.tnt.be http://www.tnt.be/?source=emailsig - tel.: +32 (0)9 3860441- Hide quoted text - - Show quoted text -
Re: [jQuery] Basic Bind Question
Hey Charlie,
methods such as .click() and .mouseover() are just convenience
methods. They all use .bind() internally. One nice thing about .bind()
is that you can use multiple event types with it. For example, instead
of doing this:
$('a')
.mouseover(function() {
var $link = $(this);
// do something with $link
})
.mouseout(function() {
var $link = $(this);
// do something with $link
});
You can combine them and avoid some repetition:
$('a')
.bind('mouseover mouseout', function(event) {
var $link = $(this);
if (event.type == 'mouseover') {
// do something with $link on mouseover
} else {
// do something with $link on mouseout
}
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 4, 2009, at 11:46 AM, Charlie Griefer wrote:
Hi All:
I've read over the docs, but don't quite understand what the bind()
event provides versus just assigning a particular event handler to a
selected element (or set of elements).
For example, consider the code below. What's the difference between
the interaction with the p elements of class first, and the p
elements of class second? Isn't the second bit effectively
binding a click event handler to a specific batch of p elements
just as the first one is?
Just not grokking it. Would appreciate if anybody could enlighten me.
script src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js
/script
script type=text/javascript
$(document).ready(function() {
$('p.first').bind('click', function() {
alert($(this).text());
});
$('p.second').click(function() {
alert($(this).text());
});
});
/script
p class=firstA/p
p class=firstB/p
p class=firstC/p
p class=firstD/p
p class=firstE/p
hr /
p class=secondF/p
p class=secondG/p
p class=secondH/p
p class=secondI/p
p class=secondJ/p
--
Charlie Griefer
http://charlie.griefer.com/
I have failed as much as I have succeeded. But I love my life. I
love my wife. And I wish you my kind of success.
Re: [jQuery] Re: Selector issue
On Dec 4, 2009, at 11:09 AM, MorningZ wrote: I wouldn't suggest going the .live route if you plan on having a lot of children of cat_list using event delegation, there is one single event wired up that handles 1 child or 1200 children using .live, you would have N number of events sitting there wired up where N is the number of children. but whatever works i suppose Nah. Using .live() wires up one event handler to document. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Basic Bind Question
Oh yeah, that too! :-D
--Karl
On Dec 4, 2009, at 1:41 PM, Rey Bango wrote:
Yep Karl's explanation was great. Also, you can leverage bind() to
work with your own custom events in the case where you want to
define something that needs to be triggered based on another action.
Using the code from the docs, you can see what I'm talking about:
$(p).bind(myCustomEvent, function(e, myName, myValue){
$(this).text(myName + , hi there!);
$(span).stop().css(opacity, 1)
.text(myName = + myName)
.fadeIn(30).fadeOut(1000);
});
$(button).click(function () {
$(p).trigger(myCustomEvent, [ John ]);
});
Rey...
Charlie Griefer wrote:
Hi Karl:
Awesome! Got it :) Thanks for the explanation and examples.
Charlie
On Fri, Dec 4, 2009 at 9:01 AM, Karl Swedberg
k...@englishrules.com mailto:k...@englishrules.com wrote:
Hey Charlie, methods such as .click() and .mouseover() are
just convenience
methods. They all use .bind() internally. One nice thing about
.bind() is that you can use multiple event types with it. For
example, instead of doing this:
$('a')
.mouseover(function() {
var $link = $(this);
// do something with $link
})
.mouseout(function() {
var $link = $(this);
// do something with $link
});
You can combine them and avoid some repetition:
$('a')
.bind('mouseover mouseout', function(event) {
var $link = $(this);
if (event.type == 'mouseover') {
// do something with $link on mouseover
} else {
// do something with $link on mouseout
}
});
--Karl
Karl Swedberg
www.englishrules.com http://www.englishrules.com
www.learningjquery.com http://www.learningjquery.com
On Dec 4, 2009, at 11:46 AM, Charlie Griefer wrote:
Hi All:
I've read over the docs, but don't quite understand what the
bind() event provides versus just assigning a particular event
handler to a selected element (or set of elements).
For example, consider the code below. What's the difference
between the interaction with the p elements of class first,
and the p elements of class second? Isn't the second bit
effectively binding a click event handler to a specific batch of
p elements just as the first one is?
Just not grokking it. Would appreciate if anybody could
enlighten me.
script
src=http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.js/script
script type=text/javascript
$(document).ready(function() {
$('p.first').bind('click', function() {
alert($(this).text());
});
$('p.second').click(function() {
alert($(this).text());
});
});
/script
p class=firstA/p
p class=firstB/p
p class=firstC/p
p class=firstD/p
p class=firstE/p
hr /
p class=secondF/p
p class=secondG/p
p class=secondH/p
p class=secondI/p
p class=secondJ/p
-- Charlie Griefer
http://charlie.griefer.com/
I have failed as much as I have succeeded. But I love my life. I
love my wife. And I wish you my kind of success.
--
Charlie Griefer
http://charlie.griefer.com/
I have failed as much as I have succeeded. But I love my life. I
love my wife. And I wish you my kind of success.
Re: [jQuery] Re: Selector issue
The .live() method uses event delegation under the hood. doing this:
$('a').live('click', function() {
// do something
});
is like doing this:
$(document).bind('click', function(event) {
if ($(event.target).closest('a').length) {
// do something
}
});
except that with .live() the selector engine does have to initially
traverse the DOM to find all of the a elements just by virtue of 'a'
being in the jQuery function. not sure, but that might be changing in
1.4. Also, I haven't had a chance to look yet, but 1.4 also might let
you pass in a context for .live() so you don't have to bind to
document each time.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 4, 2009, at 3:39 PM, MorningZ wrote:
Nah. Using .live() wires up one event handler to document.
--Karl
Doh, shame on me for my lack of facts on that .live()... i'll read
up on it some, as i usually, well always, take the delegation
route..
Re: [jQuery] Hide Table Row - Fundamentally I'm wrong.
Does it not work in every browser, or just in IE? If just IE, the
problem could be related to a problem with certain table elements
showing a height even when hidden (jQuery 1.3.2 looks for height/width
values to determine visibility).
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Dec 1, 2009, at 4:17 PM, mickey wrote:
Hi,
I am trying to simply hide / show the body of a table with toggle().
The hide seems to work but the show doesn't. e.g. header is clicked -
hide / header is clicked again - nothing.
This is my code
$('#myTable th').click(function() {
$('tbody').toggle();
});
Thing is I know something is wrong but I'm not savvy enough yet to
recognise what! Do I need to traverse the dom?
Any ideas?
Thanks.
Re: [jQuery] binding ala ActionScript??
I've never actually tried this plugin myself, but it looks like it might help you do what you're asking about: http://wiki.github.com/raid-ox/chain.js/ --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 2, 2009, at 1:16 PM, hsfrey wrote: Do jQuery or JavaScript provide any facility like the data-binding facility of ActionScript, whereby changing a variable immediately applies the changed value throughout the program? Apparently that works by implementing an onChange event whenever the variable is changed.
Re: [jQuery] Re: Stop a button within an li taking the li event?
On Dec 3, 2009, at 7:24 AM, Rich wrote: ... not sure what you mean by an input not allowed to be a child of a form though?? For valid markup, an input can be a descendant of a form element, but not a direct child. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Re: Why mootools animations is more smooth than jquery?
On Dec 3, 2009, at 7:31 PM, Dave Methvin wrote: I refrained from replying because the OP seemed trollish, but he has a point, IMHO. It would be great if someone who knew both frameworks could set up a page that demonstrated a side-by-side case where Mootools has smoother animations than jQuery. Otherwise it's hard do know what might be causing the problem, or even whether there's a problem at all. That's a great idea, Dave. I wonder how much the easing equation affects people's perception of smoothness. It might be worthwhile to try animations using the easing plugin and see if any of those equations feel smoother. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Re: Unknown pseudo-class or pseudo-element 'odd'.
Aha! I see it now. It's a warning, not an error, and it's a CSS warning. If you're seeing it in Firebug, you can hide it by unchecking Show CSS Errors in the Console preferences list. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Dec 1, 2009, at 4:11 AM, Steve Fleischer wrote: I found this thread searching for a solution to this same error. I am using FF 3.5.5 Win and jQuery 1.3.2 and get: Warning: Unknown pseudo-class or pseudo-element 'even'. when using this: $(#listTable tr:even).addClass(altRow); cheers Steve
Re: [jQuery] jQuery expander won't work in Safari?
It looks like you might be getting a JavaScript error due to a conflict between Mootools and jQuery. Not sure why it's happening in Safari, but not Firefox. This is the error that appears in Safari's error console: 53TypeError: Result of expression '($(filter)|| document).getElementsBySelector' [undefined] is not a function. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 30, 2009, at 2:49 PM, trigramnorth wrote: Hi, I'm using the code found here for jQuery expander: http://plugins.learningjquery.com/expander/ It seems to work fine in Firefox but not in Safari. Can anybody help me figure out why? Demo link: http://www.howtohostamurder.com/index.php?option=com_contentview=articleid=51
Re: [jQuery] Cluetip - Sticky pulling inline content
You can probably fix it by adding this to your CSS:
#cluetip #hidden {
display:block;
}
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 24, 2009, at 8:16 PM, christopherious wrote:
I have a Cluetip that is pulling content from a hiddden div on the
page that is only, obviously, visible when the cluetip is invoked.
Everything is working well except under IE, where the content does not
show.
I think this is probably just a simple CSS fix, but I'm stuck. Help!
Here is what I'm doing:
jQuery
script type=text/javascript
$(document).ready(function() {
$('a.load-local').cluetip({width:340, local:true, cursor:
'pointer', sticky: true, closePosition: 'title', arrows: true});
});
/script
---
HTML
a id=load-local class=load-local href=#hidden
rel=#hiddenLorem ipsum Stolle/a
div id=hiddenLorem ipsum/div
---
CSS
#hidden {
display:none;
}
Re: [jQuery] Re: list bullet style
Why not use an ol and wrap the text of each li in a span? It's
not pretty, but it works.
ol
lispanList Item/span/li
lispanList Item/span/li
lispanList Item/span/li
/ol
ol li {font-weight: bold; }
ol li span {font-weight: normal; }
If for some reason you can't put the spans in the actual markup, you
could do $('ol li').wrapInner('span/span')
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 24, 2009, at 10:20 AM, KeeganWatkins wrote:
i'm not sure i understand... hard-coded numbering? something like this
(?) :
HTML
ul
li1 spanList Item/span/li
li2 spanList Item/span/li
li3 spanList Item/span/li
/ul
if you are looking for a numbered list, you should be using the ol/
tag, although the ol/ tag is going to have the same limitations...
you can set a background image for the numbers, or separate the
content into nested span/ tags, but i don't know of any way to bold
just the number otherwise... the CSS pseudo-class :first-letter will
target the first character, not the bullet or number.
On Nov 24, 12:10 am, dnagel grandna...@gmail.com wrote:
Not quite what I'm after...
Wanted to use the LI's native numbering and be able to bold just
that,
not the content inside the LI.
Right now I have spans inside the LI with hard coded numbering to get
the bold effect. I'm just trying to accommodate a client.
Putting the spans around the inner content seems like 6 of one to
me...
Thx,
D.
Re: [jQuery] jquery 1.3.2 syntax error line 324 in IE6
that's odd! CompanionJS is saying there is a syntax error in what is
clearly a comment. Looks like that is a CompanionJS error.
On Nov 22, 2009, at 10:25 PM, viperasi wrote:
Thank reply.
the syntax error has be found jquery-1.3.2.min.js. check the attach
pic.
https://twitter.com/viperasi
my fridge!:http://bit.ly/ohBHG
有事您说话
On Fri, Nov 20, 2009 at 4:42 AM, Karl Swedberg
k...@englishrules.com wrote:
nothing here looks like it would cause a syntax error. Maybe the
problem is in your formLogin() function?
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 19, 2009, at 2:00 AM, viperasi wrote:
Whether jquery-1.3.2.js or jquery-1.3.2.min.js,i always got the
error.Other browsers without error.
Below is the code:
$(function(){
$('#username').keydown(function(event){
if(event.keyCode==13){
formLogin();
}
});
$('#password').keydown(function(event){
if(event.keyCode==13){
formLogin();
}
});
$('#valicode').keydown(function(event){
if(event.keyCode==13){
formLogin();
}
});
});
Can anyway help me please? I think it's something really simple and
I'm just being stupid.
Many thanks for reading and sorry for my poor English.
https://twitter.com/viperasi
my fridge!:http://bit.ly/ohBHG
有事您说话
jquery_error_in_ie6.JPG
Re: [jQuery] Reorder list numerically based on attribute?
Something like this might work...
var items = $('li').get();
items.sort(function(a, b) {
var relA = +$(a).attr('rel');
var relB = +$(b).attr('rel');
if (relA relB) { return 1; }
if (relA relB) { return -1; }
return 0;
});
for (var i=0; i items.length; i++) {
$('.list').append(items[i]);
}
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 23, 2009, at 8:21 PM, welshy1984 wrote:
I am wondering if it is possible to reorder a unordered list based on
the list items 'rel' attribute?
i have a list of items that change dynamically (its linked in with
google maps, the 'rel' attribute of the list item is updated with the
new distance from the google map marker icon when the marker is moved)
and i want it to update the list ordering each time a 'rel' attribute
changes.
i had a good look about, but i cant find anything for numerical
ordering (its all alphabetical) so im hoping somebody here could help?
my list essientially looks like this:
ul
li rel=42.53Place One/li
li rel=51.21Place Two/li
li rel=98.32Place Three/li
/ul
i'd be greatful for any help!
Re: [jQuery] jquery 1.3.2 syntax error line 324 in IE6
nothing here looks like it would cause a syntax error. Maybe the
problem is in your formLogin() function?
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 19, 2009, at 2:00 AM, viperasi wrote:
Whether jquery-1.3.2.js or jquery-1.3.2.min.js,i always got the
error.Other browsers without error.
Below is the code:
$(function(){
$('#username').keydown(function(event){
if(event.keyCode==13){
formLogin();
}
});
$('#password').keydown(function(event){
if(event.keyCode==13){
formLogin();
}
});
$('#valicode').keydown(function(event){
if(event.keyCode==13){
formLogin();
}
});
});
Can anyway help me please? I think it's something really simple and
I'm just being stupid.
Many thanks for reading and sorry for my poor English.
https://twitter.com/viperasi
my fridge!:http://bit.ly/ohBHG
有事您说话
Re: [jQuery] Re: how do i prevent having a paragraph tag for the text AFTER i expand?
Sorry about that. I should have been more specific in the plugin
documentation about what it was intended for. I didn't write the
plugin to work across multiple block-level elements. It looks like
that is how you're trying to use it. If I have some time in the next
few days, I'll see if I can make the plugin work for multiple block-
level elements, too.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 19, 2009, at 5:24 PM, mikko wrote:
Greetings,
I'm having the same issue with a new line being inserted. Here is the
live code: http://www.hotel1000seattle.com/packages.php The text
doesn't read correctly when expanded (skipped line). Is there a way
to prevent this?
thanks,
-me
On Nov 9, 7:19 pm, Karl Swedberg k...@englishrules.com wrote:
it would be helpful to see a page with the html output rather than
your php variables. Also, try using a span rather than a div for the
expandText.
--Karl
Karl Swedbergwww.englishrules.comwww.learningjquery.com
On Nov 5, 2009, at 6:04 AM, Kei Simone wrote:
Hi
i noticed that whenever i expanded the text, the subsequent text
expanded.
and the expand prefix...
also tends to be on the next line.
Please advise.
This is my expand code.
$(document).ready(function() {
// override some default options
$('div.expandable div').expander({
slicePoint: 160, // default is 100
expandText: 'div class=expand-
buttonnbsp;nbsp;nbsp;nbsp;nbsp;Expand/div', // default is
'read more...'
//expandSpeed: '2000', // speed in milliseconds of the
animation
effect for expanding the text
//expandPrefix: '...',
expandEffect: 'fadeIn',
collapseTimer:0, // re-collapses after 5 seconds; default is
0, so no re-collapsing
userCollapseText: 'Collapse' , // default is '[collapse expanded
text]'
afterExpand: function($thisElement) {
var vendorParaID = $thisElement.attr('id');
var underscore = vendorParaID.indexOf('_');
var vendorID = vendorParaID.substring(0, underscore);
$(#vendor_img_+vendorID).replaceWith($preloadImgVendor
[vendorID]);
var heightOfDIV = $thisElement.height();
if(heightOfDIV 290){
$thisElement.attr({style : height:290px;overflow:auto});
}
//console.debug($thisElement);
},
onCollapse: function($thisElement, byUser) {
//alert($thisElement.attr('id'));
var vendorParaID = $thisElement.attr('id');
var underscore = vendorParaID.indexOf('_');
var vendorID = vendorParaID.substring(0, underscore);
$(#vendor_img_+vendorID).replaceWith($preloadImgVendorCrop
[vendorID]);
var heightOfDIV = $thisElement.height();
if(heightOfDIV 68){
$thisElement.removeAttr(style);
}
//console.debug($thisElement);
}
});
});
This is my div for the expandable.
div class=expandable
div id={$vender.id_manufacturer}
_desc{$vender.description}/div
/div
Re: [jQuery] jquery UI draggable does not work in Firefox extension
Hi Jakkob, Would you mind posting this question to the jquery-ui google group if you haven't done so already? That group is dedicated to questions such as yours that are specifically related to jQuery UI. http://groups.google.com/group/jquery-ui/ Thanks! --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 14, 2009, at 11:22 AM, jakkob wrote: Hi, I would like to use the UI draggable featurr in my FF extension. Unfortunately this does not work. The class ui-draggable will be added to the element, but thats pretty much it. I tried to repair it changing document to window.content.document in lines 4224 (2x), 4232 when I saw that those line threw an error. Still, now comes uncaught exception: [Exception... Component is not available nsresult: 0x80040111 (NS_ERROR_NOT_AVAILABLE) location: JS frame :: chrome://test/content/jquery-1.3.2.js :: anonymous :: line 2644 data: no] and I am totally out of the game and don't know how to repair that. I hope someone can help me because, I'm really unwilling to try to code something like draggable myself. Guess it can take some days ;-) I made a testcase, the most simple FF-extension, which does nothing else, but apply the draggable feature to an element at a right click. If someone can help me (or help jquery, that is) you could install the extension, right-click any image, and will see the error immediately. http://herrmeissner.de/t...@test.com.xpi thanks for any help jakkob
Re: [jQuery] clueTip - weird issue (in IE, FF and Chrome)
Hi Andy,
The problem is occurring because you are initializing the cluetip on
mouseover by calling jQuery('a.title').cluetip( ... ).
The plugin takes care of the mouseover/mouseout stuff on its own, so
you should call it ahead of time (and only once). For example, you
could put it inside a document ready block:
$(document).ready(function() {
jQuery('a.title').cluetip({splitTitle: '|'});
});
This can be put in a separate file and then referenced with a script
tag somewhere in the HTML document.
For more information about the basics of getting the plugin to work,
check out the documentation:
http://plugins.learningjquery.com/cluetip/#getting-started
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 13, 2009, at 2:30 AM, youradds wrote:
Hi,
Got a bit of a weird issue, which I can't seem to work out :(
http://www.cancunandrivieramaya.com/new/
If you hover over the ASTA logo in the main content area, you will
see the title= content showing. Then, move off it - and hover over
again. On the second time (and any after that), the clue tip box
thing shows up just fine.
The plugin is: http://plugins.learningjquery.com/cluetip/
The code I'm using is:
a class=title onmouseover=jQuery('a.title').cluetip({splitTitle:
'|'}); title=About Us|We Offer Quality Tours at the Lowest Online
Prices Guaranteed. Reservation Agents are from Mexico, Canada, and
the United States. Booking Agents are Members of the American Society
of Travel Agents. We are online 7am-8pm 365 days a year. Except for
Feliz Hora Fridays. alt=testing style=float: right;
Can anyone point me in the right direction, as to why this is
happening? Afraid I'm still a bit of a newbie when it comes to jQuery
=)
TIA!
Andy
Re: [jQuery] Re: Change style of Div with fade
In that case, I'd use something like the Cycle plugin. http://malsup.com/jquery/cycle/ This works on a set of multiple sibling elements, so it isn't exactly what you're looking for. But if you have a single element that you want to achieve this effect on, I'd do this: 1. wrap the element in a div. 2. clone the element and append it to the wrapper div. 3. repeat #2 as needed 4. call .cycle() on the wrapper div. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 13, 2009, at 8:54 AM, Dan wrote: Thank you Karl but ... I have seen this article, it does not explain how to do what I want. I need the background to change and loop without a user doing anything. Also I need to use a fade. I have done a lot of searching and haven't found anything. It seems that it is possible, and possibly even easy, but I can't find someone who knows how to do it. Thanks. Dan On Nov 12, 7:08 pm, Karl Swedberg k...@englishrules.com wrote: Jonathan Snook's background animation article might be helpful: http://www.snook.ca/archives/javascript/jquery-bg-image-animations/ --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Nov 12, 2009, at 9:27 AM, Dan wrote: Hi, Can anyone tell me how to rotate the background-color style of a div with a fade? I need it to rotate colors every 10 seconds, having one fade into the next, and will need to have 3 background colors, then keep looping from the first color. My Div is named #rotateBG. Thanks
Re: [jQuery] Re: Load image with an ajax preloader?
On Nov 12, 2009, at 6:10 AM, Michel Belleville wrote:
You may also like this nifty little trick :
$('#myImage').attr('src', 'image.jpg').load(function()
{ alert('Image Loaded'); });
Apparently images does use the .load() event callback.
Michel Belleville
Good point, Michel. You have to be careful, though, because IE won't
report cached images as loaded that way. Instead you need to check the
image's .complete property. You might also want to handle images that
don't load properly. Someone (can't remember who) recently pointed me
to an article that discusses the complexities involved and provides a
function:
http://lucassmith.name/2008/11/is-my-image-loaded.html
(beware the first helper function)
Cheers,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] Cluetip: Access both local external content
Just write two separate calls:
$('a.some-class').cluetip({local: true});
$('a.another-class').cluetip();
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 11, 2009, at 2:35 PM, JMD wrote:
What script do I use to have cluetip alternately access local (#divID)
vs. external (external.jsp#divID) content to populate the cluetip? Not
at the same time, just some links are local and some aren't.
I can't seem to create a script that doesn't conflict with one or the
other condition.
For example, this works for external, but not local:
http://www.mail-archive.com/jquery-en@googlegroups.com/msg36931.html
Thanks!
Re: [jQuery] Change style of Div with fade
Jonathan Snook's background animation article might be helpful: http://www.snook.ca/archives/javascript/jquery-bg-image-animations/ --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 12, 2009, at 9:27 AM, Dan wrote: Hi, Can anyone tell me how to rotate the background-color style of a div with a fade? I need it to rotate colors every 10 seconds, having one fade into the next, and will need to have 3 background colors, then keep looping from the first color. My Div is named #rotateBG. Thanks
Re: [jQuery] Cluetip not working in Chrome 3.0.195
Hi there,
It looks like you're attaching the cluetip method to $
('a#ce_cluetip'). IDs must be unique per document (used only once).
I'm actually surprised that Firefox continues to find elements with
id=ce_cluetip after the first one. I guess it's more forgiving.
Try adding a class to those links instead. Something like this would
work fine: a class=msg_head ce_cluetip href= ... your text/a.
Then you can select them with $('a.ce_cluetip')
Hope that helps,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 11, 2009, at 9:20 AM, dondmcg wrote:
The cluetip displays wonderfully in all browsers I have tested except
Chrome ver. 3.0.195. The problem is that the first instance appears
but subsequent instance will not display.
Here is a link:
http://conted.nybg.org:8080/WebModule/jsp/datafeedplugin.jsp?df1=layoutdf3=LANdf4=LHNQdf5=10003#
If the above link breaks to another line be sure to paste in the full
path.
We have the page displaying output from a database right now but when
it was still in a test environment just hard coded with data the
cluetip did not display, so the issue is not with implementation with
regard to the database.
Any help or suggestions would be greatly appreciated, we love the
cluetip.
Re: [jQuery] Re: selector performance
Are those tests really using jQuery 1.1.4? If so, they're hardly relevant now, unless you're using a very old version of jQuery. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 11, 2009, at 7:23 AM, grabnerandi wrote: Check out this link: http://blog.dynatrace.com/2009/11/09/101-on-jquery-selector-performance/
Re: [jQuery] Selection logic
On Nov 10, 2009, at 7:58 AM, Michel Belleville wrote:
$(el).parents('div').get(0).addClass('myClass'); // should work, may
be a testing error (just tested it, worked for me)
Interesting that this one worked for you. I wouldn't expect it to,
since the .get() method is supposed to return a DOM element (when an
index is passed in), and addClass should only operate on the jQuery
object.
I would expect this to work:
$(el).parents('div').eq(0).addClass('myClass');
and this:
$(el).parents('div:eq(0)').addClass('myClass');
and this:
$(el).parents('div:first').addClass('myClass');
and, in 1.4 (sneak peek!), this:
$(el).parents('div').first().addClass('myClass');
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] making images cycle with clueTip
I'm not sure I follow what you're trying to do. Do you have a test page that shows what you've done so far? --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 5, 2009, at 3:37 PM, Jack wrote: Hello, is it possible to use clueTip to cycle images. I used jcycle to make a slide show based on images in an html page. That works fine. Now I would like these images to appear in a clueTip. I tried the clueTip feature that allows you to include a web page so I included the web that uses jcycle with the images but it does not work. Thanks. Jacques
Re: [jQuery] how do i prevent having a paragraph tag for the text AFTER i expand?
it would be helpful to see a page with the html output rather than
your php variables. Also, try using a span rather than a div for the
expandText.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 5, 2009, at 6:04 AM, Kei Simone wrote:
Hi
i noticed that whenever i expanded the text, the subsequent text
expanded.
and the expand prefix...
also tends to be on the next line.
Please advise.
This is my expand code.
$(document).ready(function() {
// override some default options
$('div.expandable div').expander({
slicePoint: 160, // default is 100
expandText: 'div class=expand-
buttonnbsp;nbsp;nbsp;nbsp;nbsp;Expand/div', // default is
'read more...'
//expandSpeed: '2000', // speed in milliseconds of the animation
effect for expanding the text
//expandPrefix: '...',
expandEffect: 'fadeIn',
collapseTimer:0, // re-collapses after 5 seconds; default is
0, so no re-collapsing
userCollapseText: 'Collapse' , // default is '[collapse expanded
text]'
afterExpand: function($thisElement) {
var vendorParaID = $thisElement.attr('id');
var underscore = vendorParaID.indexOf('_');
var vendorID = vendorParaID.substring(0, underscore);
$(#vendor_img_+vendorID).replaceWith($preloadImgVendor
[vendorID]);
var heightOfDIV = $thisElement.height();
if(heightOfDIV 290){
$thisElement.attr({style : height:290px;overflow:auto});
}
//console.debug($thisElement);
},
onCollapse: function($thisElement, byUser) {
//alert($thisElement.attr('id'));
var vendorParaID = $thisElement.attr('id');
var underscore = vendorParaID.indexOf('_');
var vendorID = vendorParaID.substring(0, underscore);
$(#vendor_img_+vendorID).replaceWith($preloadImgVendorCrop
[vendorID]);
var heightOfDIV = $thisElement.height();
if(heightOfDIV 68){
$thisElement.removeAttr(style);
}
//console.debug($thisElement);
}
});
});
This is my div for the expandable.
div class=expandable
div id={$vender.id_manufacturer}
_desc{$vender.description}/div
/div
Re: [jQuery] Re: Plugin Authoring Code Example Incorrect
In the meantime, I changed the wording on that page.
Both of the following will work:
1)
return this.each(function() { /* do something */ });
2)
this.each(function() { /* do something */ });
return this;
--Karl
On Nov 8, 2009, at 12:56 PM, Morten Maxild wrote:
Exactly...looks correct:-)
-Original Message-
From: Shane Riley [mailto:shanerileydoti...@gmail.com]
Sent: Sunday, November 08, 2009 6:44 PM
To: jQuery (English)
Subject: [jQuery] Re: Plugin Authoring Code Example Incorrect
I ended up using this syntax instead:
return this.each(function(){});
On Nov 7, 11:43 am, Morten Maxild mmax...@gmail.com wrote:
'return true' is wrong, you need to return the 'wrapped set' to
support
chaining. The $().each method does return the 'wrapped set' and you
can
take advantage of this.
HTH
Morten
-Original Message-
From: Shane Riley [mailto:shanerileydoti...@gmail.com]
Sent: Saturday, November 07, 2009 1:19 PM
To: jQuery (English)
Subject: [jQuery] Plugin Authoring Code Example Incorrect
I created a jQuery plugin for the sake of learning the process
and got
it working no problem. In the plugin authoring docs it says that if
you return true inside the each method, you can continue using
jQuery
chaining. However the code example above has the return this
statement
at the end of the plugin function rather than the each method.
While
quickly reading through this article after creating my plugin to
ensure I was following best practices, I placed the return true
in the
same spot and my Javascript ceased to run. I tried logging in and
editing the documentation, however it's locked. Just wanted to let
everyone know of the mistake in the hopes someone on here has the
ability to fix it.
Re: [jQuery] How to determine number of elements after dom manipulation ?
You'll have to do it within the success callback:
function dataloader(location,service,div){
$.ajax({
type: GET,
url: includes/data.xml,
dataType: xml,
success: function(xml) {
$(xml).find('group').each(function(){
if($(this).attr(name) == service) {
$(this).find(Service).each(function(){
var type = $(this).find(Type).text()
var host = $(this).find(Host).text()
var name = $(this).find(Name).text()
var site = $(this).find(Site).text()
if(type == Host site == location){
$('img src=images/server.jpg title='+ host +' /
').appendTo('#'+div);
}
});
}
});
alert($('#' + div).find('img').length); // -- should give you
correct number here
}
});
}
--Karl
On Nov 8, 2009, at 12:45 PM, Richard Bakker wrote:
Does anyone perhaps know ?
On 7 nov 2009, at 09:18, Richard Bakker wrote:
I am generating elements (img's) based on data from an xml file.
Once that is done, I want to determine the number of icons that were
generated.
i do a: alert($('img').size())
result: 0, which isn't the case
how can i determine them after they have generated ?
**
function dataloader(location,service,div){
$.ajax({
type: GET,
url: includes/data.xml,
dataType: xml,
success: function(xml) {
$(xml).find('group').each(function(){
if($(this).attr(name) == service){
$(this).find(Service).each(function(){
var type = $(this).find(Type).text()
var host = $(this).find(Host).text()
var name = $(this).find(Name).text()
var site = $(this).find(Site).text()
if(type == Host site == location){
$('img src=images/
server.jpg title='+ host +' /').appendTo
('#'+div);
}
})
}
});
}
});
}
Re: [jQuery] Re: Unknown pseudo-class or pseudo-element 'odd'.
that's strange, Lee. I just tried with FF 3.5.5 Mac (Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10.5; en-US; rv:1.9.1.5) Gecko/20091102 Firefox/3.5.5 ) and had no such errors --Karl On Nov 7, 2009, at 2:08 AM, Lee wrote: Hi Karl Miguel, Using Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv: 1.9.1.5) Gecko/20091102 Firefox/3.5.5, Viewing the test, I get this error: Warning: Unknown pseudo-class or pseudo-element 'odd'. Source File: http://test.learningjquery.com/alt-rows.html Line: 0 Not sure why this would be happening although I am having similar problems with :first etc... Can anyone on a different platform confirm this behavior? Regards, Lee.
Re: [jQuery] jQuery Validation request
The following instructions are paraphrased from: http://groups.google.com/support/bin/answer.py?hl=enanswer=46608 You can unsubscribe from a group through the web interface or via email. To unsubscribe through the web interface, just click the Edit my membership link on the right-hand side of the group's homepage at http://groups.google.com/group/jquery-en/ . Then click the Unsubscribe button on the page that appears. To unsubscribe via email, send an email to jquery-en+unsubscr...@googlegroups.com --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 4, 2009, at 12:07 AM, NathanHuang wrote: Hi all Who can tell me how to unsubscribe this mailling list? I'm gonna use another account for this mailing list. thanks -- View this message in context: http://old.nabble.com/jQuery-Validation-request-tp25995270s27240p26160052.html Sent from the jQuery General Discussion mailing list archive at Nabble.com.
Re: [jQuery] When to Use'.' When Referring To Css Classes In JQuery
Hi Mark,
I checked my pre-release PDF of the book as well as a print copy and
haven't been able to locate the code that has return $cell.find('sort-
key') without the . for the sort-key class. If you wouldn't mind,
could you point me to the page number where you saw that? I'll make
sure it gets into the list of errata on the Packt website and at http://book.learningjquery.com/6705/errata.html
thanks so much,
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 3, 2009, at 8:06 AM, Mark Phillips wrote:
Hi,
Is there some general rule to determine when '.' should be added to
JQuery method parameters when referring to CSS classes. Here's an
example from the excellent book Learning JQuery 1.3
if ($header.is('.sort-alpha')) {
findSortKey = function($cell) {
return $cell.find('sort-key')
.text().toUpperCase() + ' ' + $cell.text
().toUpperCase();
};
}
In this case both '.sort-alpha' and 'sort-key' are CSS classes. How
does one know when to include the '.'
Thanks,
Mark
PS. I accidentally placed this in the JQuery Plugin Discussions.
Apologies for the duplication.
Re: [jQuery] Selectors
this should do it:
$('tr .myToggle:visible:odd').addClass('gray');
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Nov 2, 2009, at 4:31 PM, Manimal wrote:
Here's what I'm trying to do. When I click on a tr i'd like it to hide
then re-style the table to alternate gray rows.
So on click I hide the tr then run this at the end of the animation/
hide
$('tr .myToggle').removeClass('gray');
$('tr .myToggle').not(':hidden').not(':even').addClass('gray');
I want to know if there is a better way of writing the second line:
$('tr .myToggle').not(':hidden').not(':even').addClass('gray');
I've tried:
$('tr .myToggle:not(':hidden'):odd').addClass('gray');//does not work
And some other variations on that. If i leave off the :not(':hidden')
i'll get all rows whether hidden or not, which means coloring odd or
even rows will not work, it won't look stripped.
Anyway does anyone know how to do this in the selector? Or could you
point me to some documentation on how to write selectors?
Thanks!
Re: [jQuery] Re: mouse control issue within nested tags
On Nov 1, 2009, at 1:33 AM, jmatthews wrote:
Nope. I know what I want, but not what I'm doing.
What is the proper syntax to make the mouseover() below only take
effect on the parent BUT NOT ITS CHILDREN?
$(.House,.Senate,.Assembly).mouseover(function()
You're making it pretty difficult for people to help you. You've
started a few threads asking the same basic question.
http://groups.google.com/group/jquery-en/browse_thread/thread/1745f6b53b65582b/
http://groups.google.com/group/jquery-en/browse_thread/thread/1ddb82c54ad424bf/
http://groups.google.com/group/jquery-en/browse_thread/thread/e86b4b62d0a86590/
And you have replied to earlier posts without providing any context
for that reply.
Have you taken a look at the demo I put up on jsbin.com?
http://jsbin.com/enero/edit
Doesn't that do what you want it to do? And if not, can you describe
how it's different from what you want?
You're fighting against two principles: event bubbling and style
cascading. You can limit the event to be triggered only on those top-
level items, but if you're directly applying a style to those top-
level items, the child elements are also going to receive the styles
because of the cascade, unless their styles are explicitly set to
something different. I already showed one way to get around the
cascade problem in my jsbin demo. Here is a way to limit the triggering:
$(.House,.Senate,.Assembly).mouseover(function(event) {
if (event.target == this) {
// do something
}
}).mouseout(function(event) {
if (event.target == this) {
// do something else
}
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
On Nov 1, 2009, at 1:49 PM, jmatthews wrote: On the topic of mouseenter and mouseleave, which some of you recommended, quirksmode says only IE supports this method, and the others do not at this time. The quirksmode sponsor is very critical of their failure to incorporate these methods because it would make the coding far less complex. So, I guess that is why your suggestions were not working for me http://www.quirksmode.org/dom/events/index.html jQuery normalizes the .mouseenter() and .mouseleave() methods across all browsers so they act the same way as IE's native mouseenter and mouseleave. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
Re: [jQuery] Easy question to answer
nodeName is a DOM element property. Not related to jQuery per se. Here are a couple references: https://developer.mozilla.org/en/DOM/element#Properties http://www.javascriptkit.com/domref/elementproperties.shtml --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Nov 1, 2009, at 6:44 PM, jmatthews wrote: Where is the documentation on the properties of nodes that Jquery utilizes? xxx.nodeName (where nodeName) is the property. nodeName works with Jquery. I am trying to find a list of which other do (e.g. nodeType, nodeValue, etc.). Thanks.
Re: [jQuery] Re: mouse control issue within nested tags
On Nov 1, 2009, at 2:57 PM, jmatthews wrote: Okay, see how the members are firing their respective House or Senate? That's what I want to stop. Hmm. No, I'm not seeing that. The members need their own class. Let's say you mouse over a member. I want it to turn red when you do. If you mouse over House or Senate, only House or Senate shou;d turn blue. If you mouse of member, only THAT member should turn red (not all members). Further, members MUST remain children of their respective house or senate. Make sense? Yes, it's starting to make sense. Check out this article which describes the issue in terms of referencing relatedTarget and fromElement. http://www.quirksmode.org/js/events_mouse.html yes, I've seen that article. I don't think it's necessary to refer to relatedTarget and fromElement. As I mentioned in my previous reply, you just need to use the event.target property. Here is another demo: http://test.learningjquery.com/congress.html Mousing over senate and house change those words to blue, and mousing over the members changes their respective words to red. Only the moused over senate or house changes to blue and only the moused over member changes to red. --Karl
Re: [jQuery] Re: How to Select element with class, but EXCLUDE its children?
I'd stick with what Scott said. Use mouseenter/mouseleave. But instead of setting the style with .css(), just add and remove a class. Here is a demo: http://jsbin.com/enero/edit --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 30, 2009, at 4:26 PM, jmatthews wrote: I tried them as the description in the reference was not clear as to why it would be useful. It doesn't solve the problem. That it does is make sure that if you reached the child by entering over the parent, the child event will be released only by exiting back over the parent. Kind of odd. On Oct 30, 2:16 pm, Scott Sauyet scott.sau...@gmail.com wrote: On Oct 30, 9:30 am, jmatthews jmatth...@xexam.net wrote: When I mouseover a child, it is thinking it is just the contents of parent. I need to restrict mouseover to children only, regardless of the fact that they are encapsulated by parent. You might want to look at the mouseenter and mouseleave events. http://docs.jquery.com/Events/mouseenter -- Scott
Re: [jQuery] Hide a nested UL, but show children
If you don't mind removing them, as opposed to just hiding them, you
could do this:
$('.topMenu li ul li').each(function() {
this.removeChild(this.firstChild);
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 30, 2009, at 12:23 PM, hroyale wrote:
Hi,
I have a set of nested ULs that is generated for me. I want to use it
to create a drop-down navigation menu, however I don't want to use the
values in the second level of ULs in the navigation.
It looks something like this:
ul class=topMenu
lihome/li
licommunity
ul
liawards (not a link)
ul
liaward type 1/li
liaward type 2/li
/ul
lidiscussions (not a link)
ul
lidiscussion 1
ul
limore info/li
/ul
/li
/ul
/li
/ul
/li
linews and events
ul
linews (not a link)
ul
lipress coverage/li
lipress releases/li
liannouncements/li
/ul
/li
lievents (not a link)
ul
liconferences/li
/ul
/li
/ul
/li
/ul
Level one is visible as sort of tabs, and then mousing over should
reveal a list of the next level of links. However, I would like to use
the above list and mouse over community and see a list of links
award type 1
award type 2
discussion 1
rather than
awards
discussions
Or another option would be to combine levels 2 and 3 so I would see
awards
award type 1
award type 2
discussions
discussion1
and then mousing over discussion 1 would reveal the more info link.
Please don't send me code to do the drop-down menus. I have a ton of
those. I'm only looking for help dealing with the nested UL that I
want to skip over.
Thanks,
Heather
Re: [jQuery] Re: keyup on textfields
Or, if the OP really wants all text fields to trigger it, he could
just use $(':text').keyup( ... )
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 30, 2009, at 3:20 PM, James wrote:
There are a few simple ways to do this.
Here are probably the most common:
You can assign all the relevant textfields with the same class name:
input type=text name=text1 class=specialFields /
input type=text name=text2 class=specialFields /
$(.specialFields).keyup(...);
Or you can list all the IDs in the selector:
$(#id_emp, #id_bol, #ema_pes, #nom_emp).keyup(...);
On Oct 30, 7:12 am, onaiggac denisribe...@gmail.com wrote:
Hi,
Im new in jQuery, so...
I need the textfields triggers the same function and I have a lot of
them, Im doing this way:
$('#id_emp').keyup(function(e) {
if (e.keyCode == 13) {
$('#busca').click();
}
});
$('#id_bol').keyup(function(e) {
if (e.keyCode == 13) {
$('#busca').click();
}
});
$('#ema_pes').keyup(function(e) {
if (e.keyCode == 13) {
$('#busca').click();
}
});
$('#nom_emp').keyup(function(e) {
if (e.keyCode == 13) {
$('#busca').click();
}
});
But Im think that have a better way to do this, like:
$('ALL_TEXTFIELDS').keyup(function(e) {
if (e.keyCode == 13) {
$('#busca').click();
}
});
There's something like this?
tks
Re: [jQuery] mouse control issue within nested tags
It sounds like you want to use the .after() method rather than .append() --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 31, 2009, at 11:06 AM, jmatthews wrote: This is related to an earlier post, but rather than address it is a selecting issue, I am thinking it is an append issue. I'd like others' thoughts on this. If you have: div id=mymouseHello/div You can control the innerHTML through Jquery mouseover(), etc. Simple enough. If you have: div id=mymouseHellodivGoodbye/div/div The mouseover, I believe, still on effects the Hello, recognizing it is the innerHTML of the tag with the id=mymouse. However, using the original example, if you APPEND like this: div id=mymouseHello/div and somewhere in your script, you append by: $ (#mymouse).append (divGoodbye/div) The mouseover() to mymouse now controls the next div. I think the append assumes all appended material is more innerHTML and not necessarily new sections of a document. Does anybody else agree and see this as a not so proper working of the append() method? (I have not tested the example I just wrote, but it is my observation based on my application, which uses append() to add new document sections. In my application, I have been struggling with mouseover being inherited by the appended sections. I have tried to modify the program to set particular mouseovers in the new HTML tags that are part of the appended materials - like appending div onmouseover=mymouse2Goodbye/div - all to no avail.)
[jQuery] Re: Can I somehow see what events are binded to a DOM element?
On Oct 28, 2009, at 7:45 AM, jayarjo wrote: I wonder if I can see somewhere what events are binded to a DOM element (in FireBug maybe). Maybe it's obvious, but I just don't know yet if it's even possible. this bookmarklet might help: http://www.sprymedia.co.uk/article/Visual+Event --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: jQuery beginner: Problem with :not selector.
I modified the script for you on jsbin.com so you can see how it might
work with the switch. Basically, you need to concatenate the variable,
otherwise it will be treated as a string. Also, using id (not
formattedID) for that variable is sufficient.
I'd do it differently, though. Since the three squares are siblings
and they all have class=button, you could do this:
$(document).ready(function(){
$(.button).click(function(){
$(this).css(background-color,
blue).siblings(.button).css(background-color, green);
$(#test).append(clicked id = + this.id + br /);
});
});
Here's another jsbin.com URL:
http://jsbin.com/eluli/edit
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 28, 2009, at 3:39 AM, alexpls wrote:
I'm a beginner to programming, so please bear with me, I might be
missing something really obvious here and not realising it.
For my first jQuery script that I'm writing unassisted by a tutorial,
I want to make a very simple page.
This page has three squares on it, and once you click on a square it
changes to blue while the other two squares change to green.
To avoid code repetition, and give myself a bit of a challenge I
decided to use the switch statement, and have implemented it like
this:
$(document).ready(function(){
$(.button).click(function(){
var id = # + $(this).attr(id);
switch(id){
case id:
var formattedID = \' + id + \';
$(.button:not(formattedID)).css(background-color,
green);
$(#test).append(formattedID = + formattedID + br
/);
break;
};
});
});
What seems to make this code not work is the :not statement. If I
replace the :not(formattedID) with :not('#button1') the code works
as expected. I don't understand why the :not() works with a string
that's directly typed into it, but not with a variable that holds a
string.
I've uploaded this to JS Bin, so you can see the code fully.
http://jsbin.com/ibate/edit
Any help is very appreciated,
alexpls
[jQuery] Re: cluetip memory leak
thanks for that explanation, Dave.
--Karl
On Oct 26, 2009, at 7:54 PM, Dave Methvin wrote:
I think a lot of plugins have this problem but most people aren't
creating and deleting them a lot. My splitter has this issue but I
solved that problem because I was too lazy to support splitters being
destroyed. See, the real problem is that you have a destroy
option! :-)
Since $this and other vars like $cluetip are being used within several
of the event handlers by closure, the jQuery (and DOM) objects they
contain are kept alive. You can't delete or null them out because
they're used while the cluetip is active. Those handlers would need to
be rewritten to use the local this instead and I think the handlers
need to be declared outside the .each() function scope. You'd have to
do the same with all the other cached variables like $cluetip as well.
In addition to destroy detaching all the event handlers, it should
remove any .data() or .metadata() that was put onto the element. The
jQuery UI widgets have a destroy pattern, you can see how they do it.
I also see a leak like the one discussed here:
http://groups.google.com/group/jquery-dev/browse_frm/thread/2b1981f7530dedde#
If you use any modifying operation in a chain and save the later
part of the chain in a variable, the older part of the chain is still
referenced by jQuery's .prevObject property. I can see some of those
in the cluetip plugin:
$dropShadow = $([]);
for (var i=0; i dropShadowSteps; i++) {
$dropShadow = $dropShadow.add($('div/div').css({zIndex:
cluezIndex-1, opacity:.1, top: 1+i, left: 1+i}));
};
The .add() method creates a new object each time through the loop but
the older objects are retained as a chain of .prevObject properties
leading from the jQuery object held by the final $dropShadow variable.
As long as the $dropShadow variable goes out of scope when the
function is done at the end of the .each() call to that function, it
should be reclaimed. At the moment $dropShadow is kept alive by the
cluetipshow event handler so the whole chain can't be garbage
collected.
[jQuery] Re: Announce = ChessTwit now using jQuery
Very cool! Is this an extension of your http://64squar.es/ site? --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 27, 2009, at 4:09 AM, weepy wrote: oh I forgot the link !! = www.chesstwit.com You can play chess with all your twitter friends. On 26 Oct, 16:13, weepy jonah...@gmail.com wrote: Hey there, Just wanted to tell everyone about ChessTwit that's using jQuery to good effect. The best place to play correspondence chess with your friends on Twitter. Log in and get playing! Hope you like ! Cheers @weepy
[jQuery] Re: Firing existing events from jQuery inserted html
You have run into a fairly common issue: how to get events to work
with elements that are added to the DOM, through either ajax or simple
DOM mainpulation.
Rather than using the .click(fn) shorthand, use .live('click', fn)
For more information, check out this FAQ topic:
http://docs.jquery.com/Frequently_Asked_Questions#Why_do_my_events_stop_working_after_an_Ajax_request.3F
If you still have problems after reading through it and trying one of
the many solutions, let us know.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 27, 2009, at 12:01 PM, BenR wrote:
I have a problem with jQuery appending new text to a div - but then
not firing events attached to the inserted text.
Let me explain. I have a div that contains a number of divs - the div
has a link and a hidden form. Clicking on the link fires a slideToggle
event which reveals the form.
When you submit the form AJAX handles it - and jQuery builds another
div with the correct link and the correct form which it sticks on the
end of the list. That all works fine and dandy.
What I want to be able to do is to click on the newly-added link and
have it behave in the same way as the other elements that were on the
page when it was built.
However, nothing happens when you click on it. Zip. Nadda. Rien du
tout.
Usually I have found a way round the problem - but I am slightly stuck
on my current project. Apart from forcing a page reload, is there any
way to get the browser to see the newly inserted link and apply the
jQuery action to it?
Thanks
[jQuery] Re: how to remove elements by attribute
On Oct 27, 2009, at 1:04 PM, jason wrote:
Hi,
How can I remove all div foo=whatver... div elements using the
attribute foo for my selector? Basically any div with a foo attribute
I want gone.
Thanks, Jason
You could try this:
$('div[foo]').remove();
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
[jQuery] Re: Selectable and Sortable, with copy and move.
Would you mind posting this question to the jquery-ui google group if you haven't done so already? That group is dedicated to questions such as yours that are specifically related to jQuery UI. http://groups.google.com/group/jquery-ui/ Thanks! --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 27, 2009, at 5:36 PM, Matthew wrote: Hi All, Have tried to find an example of this, and played around a bit but got no where. I want to have 2 sortable lists (just like in the demo http://jqueryui.com/demos/sortable/#connect-lists) However I also want to be able to select multiple items and then drag them all from one list to another (and still have them sortable). has anyone got any idea how to do it, it feels a bit like the holy grail as a lot of people are looking for it.
[jQuery] Re: cluetip memory leak
On Oct 25, 2009, at 8:42 PM, Andrew Tan wrote:
The memory is released when you refresh the page.
However, the users of my web app will be using the same page for 8+
hours a day and the page will most likely not be refreshed since all
the updates are displayed and retrieved via ajax and jquery.
This is fairly new terrain for me, so forgive my shooting in the dark,
but what if I put something at the very end of the .each(), like this:
return this.each(function(index) {
// all the other code ...
delete link;
delete $this;
});
would that fix the problem?
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
[jQuery] Re: clueTip display inconsistently
You're selecting only the third link with class=jt:
$('a.jt:eq(2)')
If you want all of them to show the cluetip on hover, remove
the :eq(2) part of the selector:
$('a.jt')
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 23, 2009, at 5:19 PM, wendy.constantine wrote:
I've encountered some inconsistency in how the clue tip plugin
displays. In most cases, it works perfectly using the JTip theme, yet
when there are multiple links on a page, the links lowest on the page
almost surely do not display a tip at all (except for the standard
browser tooltip). And in some cases, the style changes entirely while
using the same class.
Here is a link to a sample document:
http://d-college.cengage.com/art/0495799874_kleiner/student/bonus/ch04/04_08A.html
In all cases, what I'm trying to accomplish is an image rollover with
title. The hrefs and parameters are all constructed the same, and
what's more puzzling is that the same href would work fine if placed
at the top of the document.
This is the jquery used:
$('a.jt:eq(2)').cluetip({
cluetipClass: 'jtip', arrows: true,
dropShadow: true,
height: 'auto',
sticky: true,
waitImage: true,
closeText: 'img src=../../../jscript/images/cross.png
alt=close /',
positionBy: 'bottomTop'
});
And here's a sample href:
a class=jt href=javascript:void(0); rel=../ch03/thumbs/
0312A.jpg title=Seated statues of Rahotep and Nofret, from their
mastaba at Maidum, Egypt, Fourth Dynasty
Any help would be appreciated.
Thanks,
Wendy
[jQuery] Re: Bringing arrows for Clue tip
Is this really the link you're using in your html?
a href=#clueTipContentClick to get Clue Tip/a
If so, you shouldn't be getting the cluetip at all, since you're using
'a.cluetip' as your selector.
The arrows are images referenced in the jquery.cluetip.css stylesheet.
If you don't have those images in the images directory within the
directory where that stylesheet is located, they won't show up.
Hope that helps
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 25, 2009, at 11:04 AM, Bharanidharan wrote:
Hi All,
I am trying to bring arrows for the clue tip which i am using for my
web site. Even though i have given arrows: true in my js, i am not
getting the arrows. Please see below for the code i used and give me
your suggestions.
My js code :
jQuery('a.clueTip').each(function(){
jQuery(this).cluetip({
width: 200,
arrows: true,
cluezIndex: 999,
showTitle: false,
cursor: 'pointer',
activation: 'click',
sticky: true,
positionBy: 'fixed',
topOffset: 40,
leftOffset: -200,
local: true,
hideLocal: true,
attribute: 'href',
closePosition: 'bottom',
dropShadow: false,
closeText: ' X Close'
});
});
Clue tip Content in xhtml:
div id=clueTipContent
This is the content for clue tip
/div
My link in xhtml:
a href=#clueTipContentClick to get Clue Tip/a
Thanks,
Bharani
[jQuery] Re: cluetip memory leak
Wow, I wasn't aware of this memory leak at all. Thanks for bringing it
to my attention. I had no idea that storing the current element in a
variable would cause a leak. That's a really common thing to do in
jQuery plugins. I wonder if the memory issue has been encountered in
other plugins and how it has been dealt with.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 22, 2009, at 7:49 PM, Andrew Tan wrote:
Hi,
I have been tracking down a memory leak in my web app which
dynamically removes and adds anchors which have cluetip tooltips
attached and I think that I may have narrowed down the problem to the
main closure in cluetip which attaches the cluetip to the node (line
32: var link = this, $this = $(this);).
I have been running the following script in SIEV with a modified
version of jquery 1.3.2 with the following fix which allows the
cluetip elements to be removed. However, the anchor nodes become
orphaned as there is still 1 reference to them after the cluetip nodes
are removed?
If I change line 32 of the cluetip source to the following for testing
purposes:
var link = $('br'), $this = $('br');
The anchors are freed but the 'br' nodes start building up.
Therefore, I was wondering if anyone knows how I can work around this
problem? or if I am simply not releasing the resources correctly?
Attached Scripts and Source:
jQuery modification. After line 1247 insert the following before the
closing curly brace (http://markmail.org/message/
cfi4bvfjc3m6ww6k#query:jquery%20memory%20leak%20in%20remove%20and
%20empty+page:1+mid:tapc7zt3cwl6rw4f+state:results):
this.outerHTML = ;
Example Script:
html
head
link rel=stylesheet type=text/css href=jquery.cluetip.css/
script type=text/javascript src=jquery-1.3.2.js/script
script type=text/javascript src=jquery.cluetip.js/script
script type=text/javascript
$(document).ready(function() {
setInterval(resetCluetip, 1000);
});
function resetCluetip() {
$('a').each(function() {
$(this).cluetip('destroy');
$(this).unbind().remove();
});
$('#cluetip*').unbind().empty();
$('body').html('a href=# class=contextMenu
title=title|
bodyanchor one/abr');
$('a').each(function() {
$(this).cluetip({splitTitle: '|'});
});
}
/script
/head
body
/body
/html
[jQuery] Re: ClueTip focus/blur trouble
Hi Shawn,
Here is what I'd probably do:
After you call $this.cluetip( ...), unbind the blur event:
$this.unbind('blur.cluetip');
Then you can handle the closing of the clueTip however you want using $
(document).trigger('hideCluetip');
Maybe something like this:
$('#cluetip').hover(function() {
$(this).data('hovered', true);
}, function() {
$(this).removeData('hovered');
});
$this.blur(function() {
setTimeout(function() {
if (!$('#cluetip').data('hovered')) {
$(document).trigger('hideCluetip');
}
}, 100);
});
You'll have to add the click handler to the list items, too, of course.
Hope that gets you on the right track.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 22, 2009, at 6:08 PM, Shawn wrote:
Hi Gang.
I'm working with ClueTip and have run into some oddities.
In particular, I want to show ClueTip when a textbox receives focus.
The source shows me that I can use activation:'focus' for this and
that will result in the cluetip showing on focus and disappearing on
blur. Showing the cluetip is working fine, blurring is not.
The code I have is this:
$this.cluetip({
activation: 'focus',
local: true,
showTitle: false,
sticky: true,
mouseOutClose: true,
arrows: true,
closeText: strongX/strong,
closePosition: title
}).focus( function (){ $
(opts.source).children().removeClass(opts.hover); });
The .focus() method that I have here is simply resetting the classes
on the items the user may interact with.
I'm using ClueTip to provide a rapid selection tool - similar to a
drop down list, but without the drop down list UI. (large number of
options, needing HTML for formatting, etc.) The idea is that when
the cursor arrives at the textbox, the cluetip shows and the user
can use either the mouse to click an item, or the up/down keys and
enter to do the same. Where I am running into problems is with the
click selection. If I add a blur handler to the above code:
.blur( function () { $(document).trigger('hideCluetip'); })
then things work well for keyboard selection and blurring, but if I
click instead, the click event never happens. Because, clicking on
the cluetip triggers the blur of the textbox which closes the
cluetip before the click can be handled. I suspect this may be
partly why the onblur isn't working within ClueTip as well - the
logistics seem rather complex...
So I'm looking for suggestions on how to get this running properly.
OR for a plugin that provides similar functionality already. Thanks
for any feedback.
Shawn
[jQuery] Re: How Stop Animation Works?
you might need to use the clearQueue and gotoEnd arguments in the .stop() method: .stop(true, true) --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 24, 2009, at 12:24 AM, Stan wrote: Dear All, I have an object with mouse over and mouse out events. It fires display certain other box (almost like tooltip): box.fadeIn(slow) box.fadeOut(slow) It works absolutely fine unless mouse passed over the object without intention to stop. Then it triggers full scenario, complete fading in and then complete fading out, which is of course is not desired here. I have made amendments such as: box.stop().fadeIn(slow) box.stop().fadeOut(slow) It does the thing but only once or twice, after that whole animation stopped working. No more reaction on mouse even if mouse remains over the object. Do I use stop() method wrongly? I want to mention that unlike tooltip I need action to start right away without any timeout though in slow movement. I don't mind slight flicker when mouse passes. Currently I had to degrade to show() and hide() but could it be done with animation? Thanks in advance.
[jQuery] Re: Using google CDN for jQuery causing problems
On Oct 21, 2009, at 7:56 AM, waseem sabjee wrote: I would suggest only using a CDN to store media files like images / videos etc. scripts would perform a lot better if you ran them locally. That's not necessarily true. On Wed, Oct 21, 2009 at 11:06 AM, jitu nair.jiten...@gmail.com wrote: Using the minified version, pointed by the link http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js , I am not able to use jQuery. Can you be more specific than that? What do you mean by not able to use jQuery? I've been using it for many months, and I haven't had a problem with it (and I still don't). Looking at the source file, seems the script file is messed up. Doesn't look messed up to me. Looks minified. Again, more information would be helpful. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: Animate forces display:block?
Try setting the width of a non-floated element that has display: inline with CSS and see what you get. I haven't been able to change the width of a non-floated, inline element with CSS, so I don't imagine it can be done with JavaScript either. waseem's suggestion is probably your best bet. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 21, 2009, at 8:01 AM, waseem sabjee wrote: would it be possible for you to use a float instead of display inline ? On Wed, Oct 21, 2009 at 6:33 AM, Jared N jaredma...@gmail.com wrote: Hi all, I'm trying to animate the width of a box, but I'm noticing that during the animation jQuery is setting the element's display property to 'block' (which is not what I want, I want 'inline'). At the completion of the animation it resets it to the desired setting. I've tried over- riding this behavior by including display:'inline' as one of the animation parameters, but no dice. Any other ideas? Is this supposed to happen or is it a bug?
[jQuery] Re: Problem with animate after submit in opera
On Oct 20, 2009, at 3:53 AM, Constantin Valeriu Tuguran wrote:
Thanks for the help.
I wanted to give the user some feedback while waiting for an action to
complete so I can not return false.
I must find another way.
How about this, then? ...
$(document).ready(function(){
$(.action).click(function(){
var thisHref = this.href;
$(#panel)
.animate({top:0px}, 500)
.animate({top:0}, 4000)
.animate({top:-75px}, 500, function() {
window.location = thisHref; // -- follow the link after the last
animation finishes.
});
return false; // -- prevent the link from being followed before
animations.
});
$(#panel).click(function(){
$(#panel).hide();
});
});
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
[jQuery] Re: please help
You could set up your server-side code to send back only a portion of
the page rather than the entire thing. Other than that, we'd probably
need to see more of your code before we could offer constructive advice.
--Karl
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Oct 20, 2009, at 4:52 PM, wael alzard wrote:
hello all,
i have program a web site based on jquery ajax , but i have a problem
on preformence
that when i request any page and the content loaded form another page
the browser hangs when i call this method
$('Content').html(a); // this but the loaded page into current page
how can i improve the preformence ?
[jQuery] Re: images show before jquery and cycle plugin work their magic
If you have large images, they would take longer to load. No way around that. One thing you can do to avoid having the images span down the page is to add a style declaration for them in your stylesheet: position:absolute; I believe the cycle plugin sets the cycled elements to position:absolute as a safeguard in case it hasn't been done in the css already, but you should really do that yourself in the stylesheet. Also, make sure you set the container element to position: relative (if it's position: absolute, you can keep it that way) and set its overflow property hidden and give it explicit height and width. You still might see images loading one after the other, but at least they'll be overlapping, confined within the same space as dictated by the height and width of the container element. There are ways to get around this last issue, too, but first see how my suggestions so far work for you. --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 20, 2009, at 7:38 PM, thor wrote: Hi, I am looking for assistance with a loading problem and my apologies if this is beyond the scope of this group. I am running the lastest jQuery and Jquery cycle plugin. I haven't done any customization per se only trying to get the two components to work. I am at the point where things seem to work, however when the page loads all 4 images in my DIV span down the page and then merge into one at the end of the page load. I've seen other implementation of these 2 components but the images don't flash first and then merge. Do you believe I need to create another function or put some more logic into my page to have it load correctly. My goal would be to have everything seemlessly loaded from the start. I've explored the document.ready function and believe I have it in the correct location of my site. No matter what though other parts of the page load first I realize there are a lot of unknown variables but maybe someone has an idea? My site is clippervacations.com and I am going to change out the current homepage banners with jquery functionality. Nothing is LIVE right now, but perhaps someone can get an idea. Thanks, Thor
[jQuery] Re: jQuery UI datepicker
Hi there, Would you mind posting this question to the jquery-ui google group if you haven't done so already? That group is dedicated to questions such as yours that are specifically related to jQuery UI. http://groups.google.com/group/jquery-ui/ Thanks! --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Oct 19, 2009, at 6:52 AM, Thai Dang Vu wrote: Hi everybody, Is there any way to have the jQuery UI datepicker appearing as an image at first and then whenever we click on that image, the calendar will appear in a floating div (i.e. everything on the page isn't moved)? Thank you.
[jQuery] Re: what does this selector mean ?
On Oct 18, 2009, at 2:05 AM, Michael Geary wrote:
$('div',this) is simply a confusing way of writing $
(this).find('div'). The only reason it exists at all is for
historical reasons: it was added to jQuery before the .find()
method existed.
Never use $('div',this) in your code. Always use $(this).find('div')
instead. It is easier to read and faster too.
-Mike
Right on!
--Karl
