实例代码详解jquery.slides.js


Posted in Javascript onNovember 16, 2015

Slides ? 是一个简单的,容易定制和风格化,的jQuery幻灯片插件。

Slides提供褪色或幻灯片过渡效果,图像淡入淡出,图像预压,自动生成分页,循环,自动播放的自定义等很多选项。

用Slides插件,你可以随机播放幻灯片,设定那一套您想要开始幻灯片。它附带充分的说明和示例。

废话不多说了,直接给大家贴代码了

$(function(){
 $("#slides").slidesjs({
  play: {
  active: true,
   // [boolean] Generate the play and stop buttons.
   // You cannot use your own buttons. Sorry.
  effect: "slide",
   // [string] Can be either "slide" or "fade".
  interval: ,
   // [number] Time spent on each slide in milliseconds.
  auto: false,
   // [boolean] Start playing the slideshow on load.
  swap: true,
   // [boolean] show/hide stop and play buttons
  pauseOnHover: false,
   // [boolean] pause a playing slideshow on hover
  restartDelay: 
   // [number] restart delay on inactive slideshow
  }
 });
 });

前台:

<!doctype html>
 <head>
 <style>
  /* Prevents slides from flashing */
  #slides {
  display:none;
  }
 </style>
 <script src="http://code.jquery.com/jquery-latest.min.js"></script>
 <script src="jquery.slides.min.js"></script>
 <script>
  $(function(){
  $("#slides").slidesjs({
   width: ,
   height: 
  });
  });
 </script>
 </head>
 <body>
 <div id="slides">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
  <img src="http://placehold.it/x">
 </div>
 </body>

以上内容是关于jquery.slides.js的全部代码,希望大家喜欢。

Javascript 相关文章推荐
jQuery中bind()方法用法实例
Jan 19 Javascript
浅谈JavaScript超时调用和间歇调用
Aug 30 Javascript
jquery实现简洁文件上传表单样式
Nov 02 Javascript
jQuery实现点击行选中或取消CheckBox的方法
Aug 01 Javascript
响应式表格之固定表头的简单实现
Aug 26 Javascript
AngularJS 中的Promise --- $q服务详解
Sep 14 Javascript
过期软件破解办法实例详解
Jan 04 Javascript
Bootstrap中glyphicons-halflings-regular.woff字体报404错notfound的解决方法
Jan 19 Javascript
bootstrap table实现点击翻页功能 可记录上下页选中的行
Sep 28 Javascript
详解vue-cli快速构建vue应用并实现webpack打包
Dec 13 Javascript
LayUi中接口传数据成功,表格不显示数据的解决方法
Aug 19 Javascript
一文看懂如何简单实现节流函数和防抖函数
Sep 05 Javascript
jQuery实现标题有打字效果的焦点图代码
Nov 16 #Javascript
JavaScript中对DOM节点的访问、创建、修改、删除
Nov 16 #Javascript
常用javascript表单验证汇总
Jul 20 #Javascript
jquery验证邮箱格式是否正确实例讲解
Nov 16 #Javascript
跟我学习javascript的call(),apply(),bind()与回调
Nov 16 #Javascript
跟我学习javascript的函数调用和构造函数调用
Nov 16 #Javascript
12种JavaScript常用的MVC框架比较分析
Nov 16 #Javascript
You might like
使用GROUP BY的时候如何统计记录条数 COUNT(*) DISTINCT
2011/04/23 PHP
深入php数据采集的详解
2013/06/02 PHP
phpmailer发送邮件之后,返回收件人是否阅读了邮件的方法
2014/07/19 PHP
php中print(),print_r(),echo()的区别详解
2014/12/01 PHP
PHP模板引擎Smarty内建函数foreach,foreachelse用法分析
2016/04/11 PHP
php中preg_replace_callback函数简单用法示例
2016/07/21 PHP
向fckeditor编辑器插入指定代码的方法
2007/05/25 Javascript
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
2009/02/17 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
JavaScript-RegExp对象只能使用一次问题解决方法
2014/06/23 Javascript
js星星评分效果
2014/07/24 Javascript
js判断登陆用户名及密码是否为空的简单实例
2016/05/16 Javascript
设置jquery UI 控件的大小方法
2016/12/12 Javascript
three.js中文文档学习之创建场景
2017/11/20 Javascript
BootStrap中的模态框(modal,弹出层)功能示例代码
2018/11/02 Javascript
实例讲解vue源码架构
2019/01/24 Javascript
vue实现按需加载组件及异步组件功能
2019/05/27 Javascript
vue实现简易图片左右旋转,上一张,下一张组件案例
2020/07/31 Javascript
Vue $attrs &amp; inheritAttr实现button禁用效果案例
2020/12/07 Vue.js
[01:59]游戏“zheng”当时试玩会
2019/08/21 DOTA
wxPython 入门教程
2008/10/07 Python
详解django中自定义标签和过滤器
2017/07/03 Python
使用Selenium破解新浪微博的四宫格验证码
2018/10/19 Python
使用Python批量修改文件名的代码实例
2019/01/24 Python
Python爬取YY评级分数并保存数据实现过程解析
2020/06/01 Python
PyCharm Community安装与配置的详细教程
2020/11/24 Python
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
新西兰最大的连锁超市:Countdown
2020/06/04 全球购物
简历中个人自我评价分享
2014/03/15 职场文书
企业道德讲堂实施方案
2014/03/19 职场文书
兴趣小组活动总结
2014/05/05 职场文书
2015年高校就业工作总结
2015/05/04 职场文书
医院见习总结
2015/06/24 职场文书
宝宝满月祝酒词
2015/08/10 职场文书
防溺水主题班会教案
2015/08/12 职场文书
Python Pygame实战在打砖块游戏的实现
2022/03/17 Python