Yeah, that site is tight! In both appearance and functionality. -- Josh
----- Original Message ----- From: "Daemach" <[EMAIL PROTECTED]> To: <discuss@jquery.com> Sent: Tuesday, March 13, 2007 12:56 PM Subject: Re: [jQuery] enhanced suckerfish-style menu plugin > > It's possible - it just felt out of place when the menu transitioned > quickly > when moving onto another menued item. > > Either way it looks good. > > > Josh Nathanson-2 wrote: >> >>> On your site for example moving from "consumer info" to "glasshouse" >>> works >>> smoothly, but the menu doesn't disappear for a few seconds if you move >>> from >>> "glasshouse" to "city of gurya" (in ff2) >> >> Daemach, I think Joel did that on purpose, to allow for mousing errors. >> There is a 400 ms onmouseout delay (adjustable) whether mousing onto >> another >> menu item, or just anywhere out of the dropdown. >> >> -- Josh >> >> >> ----- Original Message ----- >> From: "Daemach" <[EMAIL PROTECTED]> >> To: <discuss@jquery.com> >> Sent: Tuesday, March 13, 2007 12:39 PM >> Subject: Re: [jQuery] enhanced suckerfish-style menu plugin >> >> >>> >>> It looks great - the only thing I would add is that the plugin roll up >>> the >>> menu when you mouse over a menu item that doesn't have a dropdown >>> attached. >>> On your site for example moving from "consumer info" to "glasshouse" >>> works >>> smoothly, but the menu doesn't disappear for a few seconds if you move >>> from >>> "glasshouse" to "city of gurya" (in ff2) >>> >>> Otherwise fantastic - very nice site. >>> >>> >>> thumblewend wrote: >>>> >>>> Hi jQuerolians, >>>> >>>> I'd like to offer up my new "superfish" plugin for feedback. >>>> Basically, it takes an existing pure CSS dropdown menu and adds the >>>> following features: >>>> - suckerfish-style hover support for IE6. The class added is >>>> 'sfHover' by default but can be changed via the options object. >>>> - timed delay on mouseout to be more forgiving of mouse-piloting >>>> errors. Default is 400 milliseconds but can be changed via the >>>> options object. >>>> - animation of sub-menu reveal. uses a fadeIn by default but can be >>>> given a custom object to be used in the first argument of the animate >>>> function. The animation speed is also customisable but is set to >>>> "normal" by default. >>>> - keyboard accessibility. Tab through the links and the relevant sub- >>>> menus are revealed and hidden as needed. >>>> >>>> Example: >>>> This plugin is now used on my Blush Tomatoes site although only two >>>> of the main menu items have dropdowns. >>>> http://www.blushtomatoes.com.au/about/ >>>> >>>> To use: >>>> 1. begin with a pure CSS dropdown menu - it will degrade nicely to >>>> this when JavaScript is unavailable, >>>> >>>> 2. add the extra selectors needed for IE as per the suckerfish >>>> technique, eg. #nav li.sfHover in addition to the regular #nav li:hover >>>> >>>> 3. call the plugin on a containing div or the actual top-level ul >>>> element, eg. $("#nav").superfish(); >>>> >>>> 4. optionally, pass in an options object to override default >>>> settings, eg. >>>> $("#nav").superfish({ >>>> hoverClass : "over", >>>> delay : 500, >>>> animation : {"opacity":"show","height":"show"}, >>>> speed : "fast" >>>> }); >>>> >>>> Here is the code: >>>> --------------------------------------------- >>>> >>>> (function($){ >>>> $.fn.superfish = function(o){ >>>> var defaults = { >>>> hoverClass : "sfHover", >>>> delay : 400, >>>> animation : {"opacity":"show"}, >>>> speed : "normal" >>>> }; >>>> var over = function(){ >>>> var $$ = $(this); >>>> clearTimeout(this.sfTimer); >>>> if (!$$.is("."+o.hoverClass)) { >>>> $$.addClass(o.hoverClass) >>>> .find("ul").animate(o.animation,o.speed) >>>> .end() >>>> .siblings().removeClass(o.hoverClass); >>>> } >>>> }; >>>> var out = function(){ >>>> var $$ = $(this); >>>> this.sfTimer=setTimeout(function(){$$.removeClass >>>> (o.hoverClass);},o.delay); >>>> }; >>>> o = $.extend(defaults, o || {}); >>>> $("li[ul]",this) >>>> .hover(over,out) >>>> .find("a") >>>> .focus(function(){ $(this).parents("li[ul]").each(over); }) >>>> .blur(function(){ $(this).parents("li[ul]").each(out); }); >>>> >>>> return this; >>>> }; >>>> })(jQuery); >>>> >>>> Tested on: >>>> Mac FF2, IE6, IE7, Safari2. >>>> Opera9 has flicker and seems to not support keyboard access (?) >>>> Not tested with three levels of menu but may work. >>>> >>>> All feedback is greatly appreciated. >>>> Joel Birch. >>>> >>>> _______________________________________________ >>>> jQuery mailing list >>>> discuss@jquery.com >>>> http://jquery.com/discuss/ >>>> >>>> >>> >>> -- >>> View this message in context: >>> http://www.nabble.com/enhanced-suckerfish-style-menu-plugin-tf3374021.html#a9461765 >>> Sent from the JQuery mailing list archive at Nabble.com. >>> >>> >>> _______________________________________________ >>> jQuery mailing list >>> discuss@jquery.com >>> http://jquery.com/discuss/ >> >> >> _______________________________________________ >> jQuery mailing list >> discuss@jquery.com >> http://jquery.com/discuss/ >> >> > > -- > View this message in context: > http://www.nabble.com/enhanced-suckerfish-style-menu-plugin-tf3374021.html#a9462094 > Sent from the JQuery mailing list archive at Nabble.com. > > > _______________________________________________ > jQuery mailing list > discuss@jquery.com > http://jquery.com/discuss/ _______________________________________________ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
