3

我在此页面底部为我正在处理的一些“建议项目”创建了 div 和容器，希望它是一个滑块，您可以在其中单击左右以查看更多信息。但是我见过的所有 jQuery 滑块仅适用于图像（轮播），是否有人可以针对这种情况向我推荐，因为它不仅仅是图像。

我假设我不能在 UL 元素中包含 DIV，因为这是我见过的所有滑块使用的。

这是我下面那个滑块区域的 html。以及页面链接：http: //bit.ly/18IOB8J

<div id="carousel-left"><a href="#"><img src="http://placehold.it/20x100" /></a></div>

             <div id="suggestedproducts">
                 <div id="suggestedproduct-container">
                     <div id="suggestedproduct-img">
                        <a href="#"><img src="http://acsupply.mangdevelopment.co.uk/upload/category/5_FixingsHardwareSecurity.jpg" /></a>
                     </div>
                     <div id="suggestedproduct-desc">
                        <a href="#"><h5>JCB 650W ELECTRIC JIGSAW</h5></a>
                        <p>&#163; 59.99</p>
                     </div>
                 </div>
                 <div id="suggestedproduct-container">
                     <div id="suggestedproduct-img">
                        <div id="suggestedproduct-img">
                        <a href="#"><img src="http://acsupply.mangdevelopment.co.uk/upload/category/5_FixingsHardwareSecurity.jpg" /></a>
                     </div>
                     </div>
                     <div id="suggestedproduct-desc">
                        <a href="#"><h5>JCB 650W ELECTRIC JIGSAW</h5></a>
                        <p>&#163; 59.99</p>
                     </div>
                 </div>
                 <div id="suggestedproduct-container">
                     <div id="suggestedproduct-img">
                        <a href="#"><img src="http://acsupply.mangdevelopment.co.uk/upload/category/5_FixingsHardwareSecurity.jpg" /></a>
                     </div>
                     <div id="suggestedproduct-desc">
                        <a href="#"><h5>JCB 650W ELECTRIC JIGSAW</h5></a>
                        <p>&#163; 59.99</p>
                     </div>
                 </div><!-- suggestedproduct-container -->
                 <div id="carousel-right"><a href="#"><img src="http://placehold.it/20x100" /></a></div>
4

2 回答 2

5

我发现Basic Slider是最好和最容易集成的滑块脚本之一。重量很轻，具有所有需要的选项：

  • 它可以滑动图像和/或 HTML 内容
  • 它反应灵敏
  • 提供漂亮的键盘、鼠标和滚轮控制
  • 非常容易集成和定制
  • 淡入淡出或滑动过渡
  • 定时选项，控制显示选项，...

它取代了我使用的所有其他滑块脚本，因为它非常容易集成和定制，而且非常轻量级，并且提供了很好的淡入淡出效果。

于 2014-01-10T16:32:37.683 回答
2

有许多支持各种内容的 jQuery 滑块。我用过很多次的其中之一是http://tympanus.net/Development/CircularContentCarousel/

源代码和教程可以在http://tympanus.net/codrops/2011/08/16/circular-content-carousel/找到

于 2013-11-01T09:26:35.367 回答