i'm moving from D6 -> D7, using a Fusion subtheme.

with D6, the Fusion theme contained superfish menus. with the move to D7, Fusion no longer bundles it, as we've now got the option of the superfish module.

In addition to the (eventual) use of the UI-managed Superfish site menus, I've got some custom css/markup/layout that I'm migrating.

In my D6 usage, I'd handled some init overrides in a 'local.js',

$(document).ready(function(){
	$("ul.sf-menu").supersubs({
		minWidth:    12, // min sub-menu width, em
		maxWidth:    27, // max sub-menu width, em
		extraWidth:  1,
	}).superfish({
		hoverClass: 'sfHover',
		speed:       0,   // ms, cref jquery animate()
		delay:       0,   // mouseout delay, ms
		animation:   {opacity:'none',height:'none'},
		autoArrows:  true,
		dropShadows: false,
		disableHI:   true,
	}).supposition();
});

in D7, I understand (reading @ http://drupal.org/node/756722#comment-3920174) that's got to change to some form of,

( function ($) {
	Drupal.behaviors.SomethingOrOther = {
		attach: function(context,settings) {
...
})(jQuery);

In the module provided "superfish.js", there's

(function($){
	$.fn.superfish = function(op){
	...
	sf.defaults = {
	hoverClass: 'sfHover',
	pathClass: 'overideThisToUse',
	pathLevels: 1,
	delay: 800,
	animation: {opacity:'show'},
	speed: 'normal',
	autoArrows: true,
	dropShadows: true,
	disableHI: false, // true disables hoverIntent detection
	onInit: function(){}, // callback functions
	onBeforeShow: function(){},
	onShow: function(){},
	onHide: function(){}
	};
...

To set an override local to my theme, e.g. --> "disableHI: true;", is 'local'.js' still the right place to override, and what's the right code to override for ONLY one menu instance, say that targeted by ".testmenu .sf-menu ul {...}?

Comments

_________’s picture

_________ commented
Status: Active » Fixed

This works,

( function ($) {
        Drupal.behaviors.mySuperFish = {
            attach: function(context, settings) {
                $('.sitemenu-inner .sf-menu ul', context).supersubs({
                    minWidth:    12, // min sub-menu width, em
                    maxWidth:    27, // max sub-menu width, em
                    extraWidth:  1,
                }).superfish({
                    hoverClass: 'sfHover',
                    speed:       0,   // ms, cref jquery animate()
                    delay:       0,   // mouseout delay, ms
                    animation:   {opacity:'toggle',height:'toggle'},
                    autoArrows:  true,
                    dropShadows: false,
                    disableHI:   true,
                    dropShadows: false,
                }).supposition();
            }
        };
    })(jQuery);

Autoclassing, submenu dropdown, etc are all working now.

Note that

    animation:   {opacity:'none',height:'none'},

has been changed. The use of property => 'none', which works just fine in D6, apparently causes an element parsing problem in D7.

Afaict, Superfish hasn't changed, or at least, I haven't found the docs that say it has.

'animation', iiuc, is effectively invoking jQUery's 'animate'. jQuery version has certainly changed from D6->D7. Checking the current api docs for animate(),

" ... In addition to numeric values, each property can take the strings 'show', 'hide', and 'toggle' ..."

And, changing it to either

    animation:   {opacity:'show',height:'show'},
    animation:   {opacity:'toggle',height:'toggle'},

does the trick.

I can't find the jQUery version changelog that says the arg list changed; in any case, it DID work with 'none' in D6, it doesn't now with D7 -- until the property arg's corrected.

Thanks.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.