several jquery lavalamp menus on one page -
i using several of jquery lavalamp menus http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/?cp=16
on 1 single page uses vertical eased scrolling. everytime scroll next anchor there new lavalamp menu initial status of "li" class "current".
for example, first div-box #content1 contains this:
<ul class="lava"> <li class="current"><a href="#content1">apples</a></li> <li><a href="#content2">pears</a></li> <li><a href="#content3">oranges</a></li> </ul> and in div #content 2 on same page have
<ul class="lava"> <li><a href="#content1">apples</a></li> <li class="current"><a href="#content2">pears</a></li> <li><a href="#content3">oranges</a></li> </ul> this method works fine once click link link in chronological order. when click , forth messes hover status of lava lamp menu set "li" class "current".
for example: clicking link #content2 on menu 1 works , hover status of target menu 2 fine, when on second menu click #content1 hover background of lavalamp menu 1 on second link instead of first - although other css styles (such bold text) still on right link set "current". it's piece of "lava" floats wrong place.
i hope try explain understandable. know how avoid conflict several menus on 1 page?
thank you!
<ul class="lava"> <li class="current"><a href="#content1">apples</a></li> <li><a href="#content2">pears</a></li> <li><a href="#content3">oranges</a></li> </ul> and in div #content 2 on same page have
<ul class="lava2"> <li><a href="#content1">apples</a></li> <li class="current"><a href="#content2">pears</a></li> <li><a href="#content3">oranges</a></li> </ul> and somewhere, write like
<script type="text/javascript"> $(function() { $(".lava").lavalamp({ fx: "backout", speed: 700 })}); $(function() { $(".lava2").lavalamp({ fx: "backout", speed: 700 })}); </script> separatally
Comments
Post a Comment