JQuery slide plugin Skippr, jquery slide skippr

JQuery slide plugin Skippr, jquery slide skippr

Skippr is a slide with left and right arrows, index buttons, sliding switching effect, and lightweight and fast slides

Set

Import jquery.skippr.css, jquery. js, and jquery. skippr. js. Note that jQuery must be before jquery. skippr. js.

Create a DIV element and add the background-images style to the div label.


<div id="container">     <div id="myskipper">  <div style="background-image: url(css/img/test1.jpg)"></div>  <div style="background-image: url(css/img/test2.jpg)"></div>  <div style="background-image: url(css/img/test3.jpg)"></div>     </div>    </div>
Start

Select the target element to call the skipper Method

$(document).ready(function(){     $("#myskipper").skippr();}); 
Option

$(document).ready(function(){    $("#myskipper").skippr({ transition: 'slide',         speed: 1000,         navType: 'block',         arrows: true,         autoPlay: false,         autoPlayDuration: 5000,         keyboardOnAlways: true,         hidePrevious: false    });}); 
Transition: Specifies the slide transition type. Currently, Skippr supports 'fade 'or 'slide.

Speed: The transition time of the slide. The default value is 500.
NavType: The shape of the navigation element. "Block" or "bubble". The default value is "block ".
Arrows: Whether to display the navigation arrow. The default value is true. Set it to false to hide the arrow.
AutoPlay: Whether to use the automatic slide playback function. The default value is false. Set to true to enable automatic playback.
AutoPlayDuration: Sets the time in milliseconds for automatic playback. Each slide is displayed. The default value is 5000 milliseconds.
HidePrevious: Whether to hide the arrow of the first slide. The default value is "false ".


:



Project demo source code download: http://download.csdn.net/detail/itmyhome/7723757






How to Use jquery slide plug-in
Place <script> </script> In the head section, and <div> </div> in the corresponding position.


Jquery plug-in usage I downloaded others' slide plug-ins, how can I apply them to my own webpage?
It is the same as the introduction of jquery, and the method of use depends on the specific plug-in description