tag:blogger.com,1999:blog-1078898499337496912.post2673343480828503755..comments2011-09-27T13:13:39.412-07:00Jeremy Martinhttp://www.blogger.com/profile/03514319709844297772noreply@blogger.comBlogger8125tag:blogger.com,1999:blog-1078898499337496912.post-27048228136481562622011-09-20T01:11:56.552-07:002011-09-20T01:11:56.552-07:00Wow thats so simple and great way to change classes, thanks!pixartnoreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-35931019430690924702008-04-21T09:34:00.000-07:002008-04-21T09:34:00.000-07:00@Karl<BR/>Hey thanks for commenting - and sorry about that! I'm afraid that post was before I even heard of jQuery or your site, and apparently failed to <A HREF="http://www.google.com/search?hl=en&q=hover+class+to+anything+in+jquery&btnG=Google+Search" REL="nofollow">google it</A> :pJeremy Martinhttp://www.blogger.com/profile/03514319709844297772noreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-14858360160414236782008-04-21T08:59:00.000-07:002008-04-21T08:59:00.000-07:00Hi Jeremy,<BR/><BR/>Glad to see you spreading the word on how easy it is to use jQuery for things like this. Reminds me of an entry I wrote last year: <A HREF="http://www.learningjquery.com/2007/02/quick-tip-set-hover-class-for-anything" REL="nofollow">Quick Tip: Set Hover Class for Anything</A>. :)Karlhttp://www.blogger.com/profile/17411929320121469017noreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-41765674656306979502008-04-21T06:22:00.000-07:002008-04-21T06:22:00.000-07:00@Shadowfiend<BR/>Thanks for the tip - that definitely does seem like a better approach.Jeremy Martinhttp://www.blogger.com/profile/03514319709844297772noreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-30039497469981075552008-04-20T11:12:00.000-07:002008-04-20T11:12:00.000-07:00A more efficient way of doing this would be to add a hover event to the document body and then assign the class on the target element (which you can get from the event object your handler is passed). This way, only one element has the event handler assigned to it. To avoid having that event fire, you can cancel the event bubble in event handlers for child elements.Shadowfiendhttp://blog.withoutincident.com/noreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-81133365704323233772008-04-18T11:36:00.000-07:002008-04-18T11:36:00.000-07:00No, I understandAnonymousnoreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-59049267298562412132008-04-18T11:30:00.000-07:002008-04-18T11:30:00.000-07:00No... I'm afraid I made the class names a little confusing. In this example, you would have some divs in your page with class "iHoverable". Now let's say we execute the script ONLY on elements with class iHoverable. The script would start off like this:<BR/><BR/># $('.iHoverable').hover(<BR/> ...<BR/>);<BR/><BR/>This loops through each instance of .iHoverable, and tells that element to add a class of "hover" when the mouseover event fires, and to remove the class of "hover" when the mouseleave event fires.<BR/><BR/>That's why, in the last CSS example, you can add styles that are only applied while it is "hovered" by using the following selector: .iHoverable.hover.<BR/><BR/>Does that make more sense now?Jeremy Martinhttp://www.blogger.com/profile/03514319709844297772noreply@blogger.comtag:blogger.com,1999:blog-1078898499337496912.post-65824954153729308462008-04-18T11:11:00.000-07:002008-04-18T11:11:00.000-07:00Sorry, I am a bit new to jquery and web development altogether. How is:<BR/><BR/>$(this).addClass('hover');<BR/><BR/>related to:<BR/><BR/># .iHoverable?<BR/><BR/>Shouldn't it be $(this).addClass('iHoverable');Anonymousnoreply@blogger.com