jquery lavalamp의 문제

Question

어떤 이유로 든 내 배경색이 내가 클릭 한 링크에 관계없이 가장 왼쪽 링크로 돌아갑니다. 누구나 클릭 링크에 머무르게하는 방법을 알고 있습니까?

CSS

#lamp { 
float:left; 
margin:25px 0px 0px 90px; 
clear: both; 
} 

.lavaLamp { 
position: relative; 
height: 29px; width: 400px; 
background: #000000 no-repeat top; 
background-image:url('http://wildfire-restaurant.com/images/lampback.png'); 
padding: 15px; margin: 10px 0; 
overflow: hidden; 
float:left; 
} 
    /* Force the list to flow horizontally */ 
    .lavaLamp li { 
     float: left; 
     list-style: none; 
    } 
     /* Represents the background of the highlighted menu-item. */ 
     .lavaLamp li.back { 
      background: no-repeat right -30px; 
      width: 9px; height: 30px; 
      z-index: 8; 
      position: absolute; 
     } 
      .lavaLamp li.back .left { 
       background: #BD5108 no-repeat top left; 
       height: 30px; 
       margin-right: 9px; 
      } 
     /* Styles for each menu-item. */ 
     .lavaLamp li a { 
      position: relative; overflow: hidden; 
      text-decoration: none; 
      text-transform: uppercase; 
      font: bold 14px arial; 
      color: #fff; outline: none; 
      text-align: center; 
      height: 30px; top: 7px; 
      z-index: 10; letter-spacing: 0; 
      float: left; display: block; 
      margin: auto 10px; 
     } 

JQuery와

<script type="text/javascript"> 
$(function() { $(".lavaLamp").lavaLamp({ fx: "backout", speed: 700 })}); 
</script> 

사이트 http://wildfire-restaurant.com/

Answer 1

당신이 this 확장자를 사용하는 경우 ....

true로 '자동 반환'을 설정해보십시오.

그렇지 않은 경우 배경이 반환되는 링크를 설정하는 옵션이있을 수 있습니다. 어떤 경우에는 onClick()을 설정해야합니다.

설명서를 읽어보십시오.

또한 확장 프로그램에 대한 자세한 정보를 게시하면 유용 할 것입니다. 이것은 CSS 문제가 아닙니다.

Answer 2

하위 페이지의 현재 li에 current 클래스를 추가해야합니다. current의 클래스 또는 첫 번째 항목으로 li을 선택

curr = $("li.current", this)[0] || $($li[0]).addClass("current")[0]; 

다음 lavalamp 플러그인은 코드의이 비트를 실행합니다. 이 클래스를 클라이언트에 보내기 전에 서버에 추가 할 수 있습니다. 자바 스크립트에서는이 클래스를 수행 할 필요가 없습니다.

업데이트이 브라우저가 '/ 메뉴 /'페이지에있을 때 HTML이 탐색을 위해 같을 것이다 것입니다

. Menu에 대한 링크와 함께 li가 얼마나 주목 class="current" :

가 이벤트

<ul class="lavaLamp"> 
    <li><a href="http://wildfire-restaurant.com/">Home</a></li> 
    <li class="current"><a href="http://wildfire-restaurant.com/menu/">Menu</a></li> 
    <li><a href="http://wildfire-restaurant.com/events/">Events</a></li> 
    <li><a href="http://wildfire-restaurant.com/friends/">Friends</a></li> 
    <li><a href="http://wildfire-restaurant.com/contact/">Contact</a></li> 
    <li><div class="left"></div></li> 
</ul> 

페이지, Events에 대한 링크와 함께 li 클래스 것 :

<li class="current"><a href="http://wildfire-restaurant.com/events/">Events</a></li> 

등을