为什么我的点击功能不能在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中工作？

回答

相关问题