首页 > 编程 > JavaScript > 正文

实例代码详解jquery.slides.js

2019-11-20 11:15:44
字体:
来源:转载
供稿:网友

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的全部代码,希望大家喜欢。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表