爲什麼我的點擊功能不能在jQuery中工作？

我想創建一個包含圖像標題和文本的簡單輪播。當我點擊「下一個」跨度時，它應該顯示下兩個<li>。但是當我這樣做時沒有任何反應。爲什麼我的點擊功能不能在jQuery中工作？

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

Fiddle

見this example。

來源

2013-10-01 andresr

GET http://andres321r.byethost15.com/carousel/jquery-1.10.2.min.map 404（Not Found） –

您可以在小提琴中重新創建問題嗎？ –

@RUJordan這是無關緊要的，它是jQuery的地圖，所以你可以解壓縮代碼並獲取變量名稱而不是a，b，c ... –

這是純粹的CSS問題。您只需要將position: relative;添加到您的li，因此您可以在腳本中生成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/。另外，我還有一個小循環功能的Github示例可以幫助你：https://github.com/kunalbhat/cycler – kunalbhat

是的，我知道有很多插件，但我想開始學習如何創建自己的插件大聲笑。我會看看你的，看看我是否學到了什麼。再次感謝。 – andresr

添加position: relative您.carousel，內裏。

來源

2013-10-01 21:17:33

爲什麼我的點擊功能不能在jQuery中工作？

回答

相關問題