基于Jquery代码实现支持PC端手机端幻灯片代码


Posted in Javascript onNovember 17, 2015

分享一款支持PC端手机端幻灯片代码是一款支持移动触摸,支持鼠标拖拽切换,支持带进度条的自动播放模式。交果图如下 :

基于Jquery代码实现支持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>
Javascript 相关文章推荐
JavaScript中的isXX系列是否继续使用的分析
Apr 16 Javascript
js弹窗返回值详解(window.open方式)
Jan 11 Javascript
SeaJS 与 RequireJS 的差异对比
Dec 08 Javascript
js实现选中复选框文字变色的方法
Aug 14 Javascript
深入探讨javascript函数式编程
Oct 11 Javascript
jQuery移动web开发中的页面初始化与加载事件
Dec 03 Javascript
详解React-Todos入门例子
Nov 08 Javascript
Javascript实现购物车功能的详细代码
May 08 Javascript
VUE预渲染及遇到的坑
Sep 03 Javascript
javascript中toFixed()四舍五入使用方法详解
Sep 28 Javascript
elementUI vue this.$confirm 和el-dialog 弹出框 移动 示例demo
Jul 03 Javascript
layui form.render('select', 'test2') 更新渲染的方法
Sep 27 Javascript
举例说明如何为JavaScript的方法参数设置默认值
Nov 17 #Javascript
Jquery easyui 实现动态树
Nov 17 #Javascript
总结JavaScript中布尔操作符||与&amp;&amp;的使用技巧
Nov 17 #Javascript
实例代码讲解jquery easyui动态tab页
Nov 17 #Javascript
用JavaScript来美化HTML的select标签的下拉列表效果
Nov 17 #Javascript
基于Jquery easyui 选中特定的tab
Nov 17 #Javascript
jquery实现简单的表单验证
Nov 17 #Javascript
You might like
无线电波是什么?它是怎样传输的?
2021/03/01 无线电
php Smarty 字符比较代码
2011/02/27 PHP
PHP删除非空目录的函数代码小结
2013/02/28 PHP
PHP时间格式控制符对照表分享
2013/07/23 PHP
PHP简单创建压缩图的方法
2016/08/24 PHP
浅谈PHP匿名函数和闭包
2019/03/08 PHP
Laravel 登录后清空COOKIE的操作方法
2019/10/14 PHP
javascript操作cookie_获取与修改代码
2009/05/21 Javascript
简略说明Javascript中的= =(等于)与= = =(全等于)区别
2013/04/16 Javascript
window.location.hash知识汇总
2015/11/09 Javascript
JS动态增删表格行的方法
2016/03/03 Javascript
jQuery可见性过滤选择器用法示例
2016/09/09 Javascript
jQuery如何防止Ajax重复提交
2016/10/14 Javascript
解析AngularJS中get请求URL出现的跨域问题
2016/12/01 Javascript
vue用递归组件写树形控件的实例代码
2018/07/19 Javascript
vue父组件触发事件改变子组件的值的方法实例详解
2019/05/07 Javascript
vue+element 实现商城主题开发的示例代码
2020/03/26 Javascript
JavaScript运动原理基础知识详解
2020/04/02 Javascript
浅谈在vue-cli3项目中解决动态引入图片img404的问题
2020/08/04 Javascript
js 图片懒加载的实现
2020/10/21 Javascript
python实现倒计时的示例
2014/02/14 Python
Python将多个excel文件合并为一个文件
2018/01/03 Python
使用 Visual Studio Code(VSCode)搭建简单的Python+Django开发环境的方法步骤
2018/12/17 Python
python3+django2开发一个简单的人员管理系统过程详解
2019/07/23 Python
python选取特定列 pandas iloc,loc,icol的使用详解(列切片及行切片)
2019/08/06 Python
树莓派3 搭建 django 服务器的实例
2019/08/29 Python
python 弧度与角度互转实例
2020/04/15 Python
keras 自定义loss model.add_loss的使用详解
2020/06/22 Python
使用Keras预训练好的模型进行目标类别预测详解
2020/06/27 Python
小学教师岗位职责
2013/11/25 职场文书
小学门卫岗位职责
2013/12/17 职场文书
2014全国两会心得体会
2014/03/17 职场文书
2014年民主评议党员工作总结
2014/12/02 职场文书
小学班主任自我评价
2015/03/11 职场文书
2015年防灾减灾工作总结
2015/07/24 职场文书
mysql分表之后如何平滑上线详解
2021/11/01 MySQL