分享一款支持PC端手机端幻灯片代码是一款支持移动触摸,支持鼠标拖拽切换,支持带进度条的自动播放模式。交果图如下 :
效果演示 源码下载
html代码:
<div class="flex"> <ul class="slides"> <li data-title="Slide 1"> <img alt="" src="img/beasts_feature.jpg"> </li> <li data-title="Slide 2"> <img alt="" src="img/element-taiwan-thmb.jpg"> </li> <li data-title="Slide 3"> <img alt="" src="img/streets-newyork.jpg"> </li> </ul> </div> <script src="js/jquery-2.1.1.min.js" type="text/javascript"></script> <script type="text/javascript" src="js/jflex.min.js"></script> <script type="text/javascript"> $('.flex').jFlex({ autoplay: true }); </script>
您可能感兴趣的文章:
- jQuery旋转木马式幻灯片轮播特效
- jquery简单实现幻灯片的方法
- jQuery插件animateSlide制作多点滑动幻灯片
- jQuery插件Skippr实现焦点图幻灯片特效
- jQuery插件slick实现响应式移动端幻灯片图片切换特效
- jquery幻灯片插件bxslider样式改进实例
- jquery特效 幻灯片效果示例代码
- Jquery图片滚动与幻灯片的实例代码
- jQuery Tools tab(幻灯片)
- jQuery模拟360浏览器切屏效果幻灯片(附demo源码下载)