So i've implemented a superfish menu in one of the sites I'm currently developing but it isn't working as well as I would like. When I go to mootools.net there is a fancy little fade in that the menu does. I have copied their code and replicated it in my site but the drop down just appears, no glorious animation. If anyone has any ideas I'm all ears. The site is at...

 

http://scribblespaper.com/sc/products.php?...Babysitter-Pads

 

See the Address section as it is the only menu item with a drop down.

 

Thanks!

I'm a little confused. Superfish is a jquery plug-in? Yet you mention a mootools example.

With so many different scripts in your site, one of them might be conflicting with another and stopping the superfish from working?

I don't have any experience with jquery but if it is mootools, I may be able to help.

Whoops, your totally right it is jQuery. Typing too fast can get me into trouble. I think the superfish menu is work fine but I don't think I'm calling the animation correctly. I guess that is where my problem is. Here is what I have.

 

<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/jquery.js"></script>
<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/menudrop.js"></script>
<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/common.js"></script>

<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/iselector.js"></script>
       <script type="text/javascript" src="http://scribblespaper.com/sc/javascript/superfish.js"></script>
       <script type="text/javascript" src="http://scribblespaper.com/sc/javascript/supersubs.js"></script>


<script type="text/javascript">

$(document).ready(function(){
          $('sf-menu').superfish({
             delay:1000,
             animation: {opacity:'show',height:'show'},
             speed: 'fast',
             autoArrows: false,
             dropShadows: true
           });
        });

</script>

If jquery works similar to mootools, which I suspect, then this bit of code:

$('sf-menu')

is looking for an element with an id of sf-menu.

You only have the ul with a class of sf-menu.

If jquery works similar to mootools, which I suspect, then this bit of code:

$('sf-menu')

is looking for an element with an id of sf-menu.

You only have the ul with a class of sf-menu.

 

Thanks for your help but it still does the same business. I think you have put me on the right path though. I'll keep tinkering.

If jquery works similar to mootools, which I suspect, then this bit of code:

$('sf-menu')

is looking for an element with an id of sf-menu.

You only have the ul with a class of sf-menu.

 

Thanks for your help but it still does the same business. I think you have put me on the right path though. I'll keep tinkering.

Whoops, your totally right it is jQuery. Typing too fast can get me into trouble. I think the superfish menu is work fine but I don't think I'm calling the animation correctly. I guess that is where my problem is. Here is what I have.

 

<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/jquery.js"></script>
<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/menudrop.js"></script>
<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/common.js"></script>

<script type="text/javascript" src="http://scribblespaper.com/sc/javascript/iselector.js"></script>
       <script type="text/javascript" src="http://scribblespaper.com/sc/javascript/superfish.js"></script>
       <script type="text/javascript" src="http://scribblespaper.com/sc/javascript/supersubs.js"></script>


<script type="text/javascript">

$(document).ready(function(){
          $('sf-menu').superfish({
             delay:1000,
             animation: {opacity:'show',height:'show'},
             speed: 'fast',
             autoArrows: false,
             dropShadows: true
           });
        });

</script>

 

From what I've seen, i think your problem is this:

 

<script type="text/javascript">

 

$(document).ready(function(){

$('sf-menu').superfish({

delay:1000,

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

speed: 'fast',

autoArrows: false,

dropShadows: true

});

});

 

</script>

---------change back to:

 

<script type="text/javascript">

 

$(document).ready(function() {

$('ul.sf-menu').superfish();

});

 

</script>

 

Then, make your changes to the superfish.js file. Probably like this:

 

Replace:

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(){}

};

 

With this:

 

sf.defaults = {

hoverClass : 'sfHover',

pathClass : 'overideThisToUse',

pathLevels : 1,

delay : 1000,

animation : {opacity:'show'},

speed : 'fast',

autoArrows : false,

dropShadows : true,

disableHI : false, // true disables hoverIntent detection

onInit : function(){}, // callback functions

onBeforeShow: function(){},

onShow : function(){},

onHide : function(){}

};

Still no dice, great idea though. I must have some ID mixed up somewhere because reseting the default like you recommended should be pretty solid. Thanks for your help

Still no dice, great idea though. I must have some ID mixed up somewhere because reseting the default like you recommended should be pretty solid. Thanks for your help

 

i had copied your source into my dreamweaver and loaded it into firefox and ie. what's strange is that it worked fine locally on my computer. it seems you have a path issue when it is uploaded, but i haven't had the time yet to see if i could find it. i hope this helps, though. good luck!

i had copied your source into my dreamweaver and loaded it into firefox and ie. what's strange is that it worked fine locally on my computer. it seems you have a path issue when it is uploaded, but i haven't had the time yet to see if i could find it. i hope this helps, though. good luck!

 

 

Hmm interesting, i'll check and see. Good eye my friend