Comments on: Unobtrusive Rollovers Using YUI http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/ News and Artilces about Designing and Developing with Yahoo! Libraries. Sun, 27 Jul 2008 00:16:55 +0000 http://wordpress.org/?v=2.3.3 By: Chad Kieffer http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-365011 Chad Kieffer Fri, 02 May 2008 01:09:30 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-365011 Based on a few comments, I've written a companion post which illustrates <a href="http://2tbsp.com/node/92" title="Improving JavaScript Performance and Scalability" rel="nofollow">how to improve the performance and scalability of the original rollover example</a>. Based on a few comments, I’ve written a companion post which illustrates how to improve the performance and scalability of the original rollover example.

]]> By: Caridy Patino http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-364392 Caridy Patino Wed, 30 Apr 2008 23:55:16 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-364392 Hello Guys: The Lighter Plugin does the same thing, but with the different that you don't need to add the listener manually for the mouseover/out, in fact there is not listeners at all, because the bubbling library does the control of the mouse movement at the highest level (document.body). http://www.bubbling-library.com/sandbox/misc/yui-rollover.html You just need to create the correct html markup and CSS rules. Also you can include the lighter plugin on demand, and everything should works. Best Regards, Caridy Hello Guys:

The Lighter Plugin does the same thing, but with the different that you don’t need to add the listener manually for the mouseover/out, in fact there is not listeners at all, because the bubbling library does the control of the mouse movement at the highest level (document.body).
http://www.bubbling-library.com/sandbox/misc/yui-rollover.html

You just need to create the correct html markup and CSS rules. Also you can include the lighter plugin on demand, and everything should works.

Best Regards,
Caridy

]]> By: Rollovers using the Motionbox EventHandler at Topper’s Blog http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-364325 Rollovers using the Motionbox EventHandler at Topper’s Blog Wed, 30 Apr 2008 21:15:49 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-364325 [...] YUI has yet another nice writeup on unobtrusive rollovers. [...] […] YUI has yet another nice writeup on unobtrusive rollovers. […]

]]> By: Dylan http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-363611 Dylan Wed, 30 Apr 2008 01:18:24 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-363611 Chad has got it right. YUI is the best but the real pudding is when we don't need external libraries at all. Chad has got it right. YUI is the best but the real pudding is when we don’t need external libraries at all.

]]> By: Chad http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-363230 Chad Tue, 29 Apr 2008 16:45:14 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-363230 @Christian/Eric, Arther and Eric are spot on as far as my intent — illustrate the evolution of JavaScript methods with a simple example that shows the benefits of unobtrusive techniques. Hopefully this example will be made obsolete as IE 6's browser market share falls. @Christian/Eric, Arther and Eric are spot on as far as my intent — illustrate the evolution of JavaScript methods with a simple example that shows the benefits of unobtrusive techniques. Hopefully this example will be made obsolete as IE 6’s browser market share falls.

]]> By: Asvin Balloo http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362708 Asvin Balloo Tue, 29 Apr 2008 05:33:54 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362708 About 2 weeks ago, orange.mu was launched, where we use more or less the same thing, with roll over menus. Nice tutorial ;-) About 2 weeks ago, orange.mu was launched, where we use more or less the same thing, with roll over menus. Nice tutorial ;-)

]]> By: Eric Miraglia http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362644 Eric Miraglia Tue, 29 Apr 2008 03:17:40 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362644 @Christian/Eric, Fair enough -- but I saw the example as being more of indication of how we've evolved from writing JavaScript inline and using it to modify style objects directly to separating the presentation and script pieces out and then using libraries to make the solution more scalable. As Arthur points out, IE's :hover issues make this kind of strategy directly relevant in some cases -- and even more relevant if you're doing something more interesting than just toggling styles, which is often the case in rollover implementations. I don't think Chad was advocating the use of JavaScript where only CSS is necessary; rather, I saw him exemplifying the progression toward an unobtrusive pattern for those cases where JS will be required. -Eric @Christian/Eric, Fair enough — but I saw the example as being more of indication of how we’ve evolved from writing JavaScript inline and using it to modify style objects directly to separating the presentation and script pieces out and then using libraries to make the solution more scalable. As Arthur points out, IE’s :hover issues make this kind of strategy directly relevant in some cases — and even more relevant if you’re doing something more interesting than just toggling styles, which is often the case in rollover implementations. I don’t think Chad was advocating the use of JavaScript where only CSS is necessary; rather, I saw him exemplifying the progression toward an unobtrusive pattern for those cases where JS will be required. -Eric

]]> By: Arthur M http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362636 Arthur M Tue, 29 Apr 2008 03:06:01 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362636 The reason why techniques like this have evolved is that IE didn’t support hover except on anchor elements. So you can do almost all of this in CSS, except if you want to support IE, then you have to have a fallback. I think Chad’s article though is meant to describe a technique you can hang more stuff off of than just a CSS hover…this just illustrates the foundation for what you’d do to make your script unobtrusive. The reason why techniques like this have evolved is that IE didn’t support hover except on anchor elements. So you can do almost all of this in CSS, except if you want to support IE, then you have to have a fallback. I think Chad’s article though is meant to describe a technique you can hang more stuff off of than just a CSS hover…this just illustrates the foundation for what you’d do to make your script unobtrusive.

]]> By: Eric Ferraiuolo http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362635 Eric Ferraiuolo Tue, 29 Apr 2008 03:04:33 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362635 I don't see the point here... like Christian said, this could be done purely in CSS; why bother with JavaScript to do something this trivial? I don’t see the point here… like Christian said, this could be done purely in CSS; why bother with JavaScript to do something this trivial?

]]> By: Christian Decker http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362612 Christian Decker Tue, 29 Apr 2008 01:48:25 +0000 http://yuiblog.com/blog/2008/04/28/unobtrusive-rollovers-using-yui/#comment-362612 Looks great, but couldn't we have achieved the same effect using only standard CSS selectors? I usually tend to use CSS when possible as it works also on browsers that do not allow JS execution. Looks great, but couldn’t we have achieved the same effect using only standard CSS selectors?
I usually tend to use CSS when possible as it works also on browsers that do not allow JS execution.

]]>