내 클릭 기능이 jquery에서 작동하지 않는 이유는 무엇입니까?

이미지 제목과 텍스트를 보유하고있는 간단한 회전식 컨베이어를 만들 수 있습니다. '다음'범위를 클릭하면 다음 두 개의 <li>이 표시됩니다. 그러나 그렇게 할 때 아무 일도 일어나지 않습니다. 내 클릭 기능이 jquery에서 작동하지 않는 이유는 무엇입니까?

Fiddle

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#right').click(function() { 
      $('li').animate({ 
       left: '-600px' 
      }, 500); 
     }); 
    }); 
</script>

는 this example를 참조하십시오.

출처

2013-10-01 andresr

GET http://andres321r.byethost15.com/carousel/jquery-1.10.2.min.map 404 (찾을 수 없음) –

피들에 문제를 재현 할 수 있습니까? –

@RUJordan 그게 무의미합니다. jquery 맵이므로 코드를 압축 해제하고 a, b, c 대신 변수 이름을 얻을 수 있습니다. –

이것은 순수 CSS 문제입니다. li에 position: relative;을 추가하기 만하면 스크립트에 left 속성을 적용 할 수 있습니다.

.carousel-inner li { 
    display: inline; 
    float: left; 
    margin: 20px; 
    border: 1px solid #999; 
    padding: 25px; 
    border-radius: 20px; 
    position: relative; // Add this so setting a left position will work 
}

Chrome Inspector에 추가하기 만하면 작동하는 것을 볼 수 있습니다. 차오!

출처

2013-10-01 21:16:07 kunalbhat

예! 고마워, 이제는 기능적인 회전 목마 롤을 만드는 방법을 더 읽어야 할 것이다. – andresr

도와 드리겠습니다. 또한 항상 jQuery Cycle 플러그인 (http://jquery.malsup.com/cycle/)이 있습니다. 또한, 나는 당신을 도울 수있는 cycler 함수의 작은 Github 예제를 가지고있다. https://github.com/kunalbhat/cycler – kunalbhat

그래, 거기에 많은 플러그인이 있다는 것을 알고 있지만, 내 자신을 만드는 법을 배우기 시작하고 싶다. 롤. 나는 너를보고 내가 무엇인가를 배울 지 지켜 볼 것이다. 다시 한번 감사드립니다. – andresr

.carousel-inner li에 position: relative을 추가하십시오.

출처

2013-10-01 21:17:33

내 클릭 기능이 jquery에서 작동하지 않는 이유는 무엇입니까?

답변

관련 문제