[jscrollpane] Applying to a superfish third level menu, UL with overflow:auto

[artgoddess]

Hello!

Thank you very much Kevin for this useful script. I would love to use
it in a website, but I'm facing a problem.

Seems that jscrollpane has problems when being applied to a UL with
overflow:auto. The point is that I need to make a nav bar with
superfish, and the third level must have the scroll bar. Obviously,
the default browser scrollbar is horrible and would love to use a
simple one.

Feel free to check these two versions, first one without jscrollpane:

http://78.129.178.243/~enzymear/wp-content/themes/enzyme/menu1.html

And second one with jscrollpane:

http://78.129.178.243/~enzymear/wp-content/themes/enzyme/menu1.html

I really appreciate your time, so If you think this can be solved,
please let me know how much a convenient donation for this can be.

Best regards.

--
You received this message because you are subscribed to the Google Groups "jscrollpane" group.
To post to this group, send email to jscro...@googlegroups.com.
To unsubscribe from this group, send email to jscrollpane...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/jscrollpane?hl=en.

[Kelvin Luck]

Hi,

(I guessed that the second URL below was meant to point to menu2.html)

jScrollPane doesn't work well on absolutely positioned elements. I see
that on your page the CSS selector ".sf-menu ul" has absolute positioning
on it. Unfortunately this will conflict with jScrollPane's own
positioning...

If you weer applying jScrollPane to e.g. the element #menu-item-181 (e.g.
the surrounding li rather than the contained ul) then it might work
better. I'm just rushing off now but if you are still stuck on this later
let me know and I'll see if I can give you a better hint,

Cheers,

Kelvin :)

On Thu, 20 May 2010 23:40:33 +0100, artgoddess <dianat...@gmail.com>
wrote:

[artgoddess]

Hello Kelvin,

I have tried to solve this issue without success.

Please see the situation right now: http://bit.ly/c1i1Tt

The third level menu has an overflow:auto, with fixed width and
height. But when I apply the scroll, the third level dissapears.

I have tested all options, for example:

$('#menu-item-189 ul.sub-menu ul.sub-menu').jScrollPane();
$('ul.sf-menu li li.sfHover > ul.sub-menu').jScrollPane();
$('#menu-item-189 ul.sub-menu li').jScrollPane();
$('ul.sf-menu li li.sfHover').jScrollPane();
$('#menu-item-189 ul.sub-menu li a').jScrollPane();

None of these works... :-(

I would be very grateful if you can help me with this. Thank you!

On May 21, 10:03 am, "Kelvin Luck" <kel...@kelvinluck.com> wrote:
> Hi,
>
> (I guessed that the second URL below was meant to point to menu2.html)
>
> jScrollPane doesn't work well on absolutely positioned elements. I see  
> that on your page the CSS selector ".sf-menu ul" has absolute positioning  
> on it. Unfortunately this will conflict with jScrollPane's own  
> positioning...
>
> If you weer applying jScrollPane to e.g. the element #menu-item-181 (e.g.  
> the surrounding li rather than the contained ul) then it might work  
> better. I'm just rushing off now but if you are still stuck on this later  
> let me know and I'll see if I can give you a better hint,
>
> Cheers,
>
> Kelvin :)
>

> On Thu, 20 May 2010 23:40:33 +0100, artgoddess <dianatram...@gmail.com>  

[artgoddess]

Hello!

Seems I'm getting the best result calling the script with this line of
code:

$('#menu-item-190 ul.sub-menu').jScrollPane();

The problem is that the CSS code is completely changed, positions of
elements are completely changed and the third level menu dissapears.

As suggested, I have removed the absolute positioning from ".sf-menu
ul" with a similar result.

Any advice on this issue will be really appreciated.

Thank you.