That's great, thanks! I'm slowly starting to understand these hooks
and callback etc.

I have played around with it for a while, and finally changed the
onBeforeShow in sf.defaults. I couldn't get it to work with just using
your example, tried different locations of putting that code. This
works fine, for now:

        sf.defaults = {
                hoverClass      : 'sfHover',
<--snip-->
                onBeforeShow: function(){
              // check window top of parent ul
              var ulOffset=$(this).parent().parent().offset().top;

              // check window offset of the parent li
              var liOffset=$(this).parent().offset().top;

              // adjust top position of sub by difference of offsets
              (this).css("top",(ulOffset-liOffset))
              },
                onShow          : function(){},
                onHide          : function(){}
        };

I am curious where you think your example code should have gone. Is
that in the html file HEAD section? Or somewhere else? Because I'm
sure this is not the best way of handling it :-)

Thanks again!

Jacco


On Oct 1, 4:00 pm, Charlie <charlie...@gmail.com> wrote:
> good plugins offer options to hook into events andsuperfishis one of those
> the submenus are all absolutely positioned to their parent . Insuperfishcss 
> look for the li:hover ul, sfHover ul etc that reposition the sub to top=0 
> when visible. When not visible it has top=-999em
> InSuperfishAPI you will find an option "onBeforeShow" that allows you to 
> create a function where "this" is the sub ul about to be displayed. Here a 
> function to change the position of the sub can be created
> a simple method to align all the subs where all tops will be at top of 
> overall menu is to first find position of the menu in window
> var menuOffset=$('ul.sf-menu').offset().top;
> // now you can use the menu container as reference point to align the other 
> elements
> $('ul.sf-menu').superfish({
>            
>                 onBeforeShow:  function(){
>                 // check window offset of the parent li
>                     var offset=$(this).parent().offset().top
>                 // adjust top position of sub by difference of offsets
>                     $(this).css("top",(menuOffset-offset))
>                    
>                 }
>                
> });
> good luck!
> Jacco wrote:Hi All, I am new to jQuery &Superfish, but it seemd like the most 
> logical way to do a quick prototype for a menusystem. I am trying to create a 
> verertical menu system (usingsuperfish-vertical). However, I'd like to tweak 
> the behaviour of the submenu, and have been unsuccessful so far. Here's what 
> the current solution does (straight out of the box) - assume menu item 3 is 
> hovered over: menu item 1 > menu item 2 > [ menu item 3 > ] menu item 3.1 
> menu item 4 > menu item 3.2 menu item 5 > menu item 3.3 menu item 6 > menu 
> item 3.4 menu item 3.5 menu item 3.6 Normal, expected behaviour. But I would 
> like to use this type of menu in a vertically restricted area, and therefore 
> try to place the submenu in such a way that it still fits. I am aware of many 
> restictions that apply when I go about this (submenu can never be more items 
> than the main menu, for instance), but let's assume I can control that. So, I 
> would like the submenu to take into accoutn the height of the available 
> space. Two examples, for menu item 3 & menu item 6: menu item 1 > menu item 
> 3.1 menu item 2 > menu item 3.2 [ menu item 3 > ] menu item 3.3 menu item 4 > 
> menu item 3.4 menu item 5 > menu item 3.5 menu item 6 > menu item 3.6 menu 
> item 1 > menu item 2 > menu item 3 > menu item 6.1 menu item 4 > menu item 
> 6.2 menu item 5 > menu item 6.3 [ menu item 6 > ] menu item 6.4 Is this 
> possible? I cannot find the code that determines the top of the new div that 
> is being displayed (probably due to my newness to jQuery &Superfish). But any 
> pointers would be greatly appreciated! Thanks in advance, Jacco

Reply via email to