SuperSlidev2.1 carousel images and seamless scrolling, superslidev2.1 seamless
SuperSlidev2.1 slideshow image and seamless scroll use method click link: http://down.admin5.com/demo/code_pop/18/562/index.html
The simple usage is as follows:
Html
<Div class = "bd">
<Ul>
<Li _ src = "url (images/1.jpg)" style = "background: # E2025E center 0 no-repeat; "> <a href =" http://www.17sucai.com "> </a> </li>
<Li _ src = "url (images/2.jpg)" style = "background: # DED5A1 center 0 no-repeat; "> <a href =" http://www.17sucai.com "> </a> </li>
<Li _ src = "url (images/3.jpg)" style = "background: # B8CED1 center 0 no-repeat; "> <a href =" http://www.17sucai.com "> </a> </li>
<Li _ src = "url (images/4.jpg)" style = "background: # 98918E center 0 no-repeat; "> <a href =" http://www.17sucai.com "> </a> </li>
<Li _ src = "url (images/5.jpg)" style = "background: # FEFF19 center 0 no-repeat; "> <a href =" http://www.17sucai.com "> </a> </li>
</Ul>
</Div>
<Div class = "hd"> <ul> </div>
<Span class = "prev"> </span>
<Span class = "next"> </span>
Js
/*** Full-screen carousel banner effect ***/
$ (". FullSlide"). hover (function (){
$ (This). find (". prev,. next"). stop (true, true). fadeTo ("show", 0.5)
},
Function (){
$ (This). find (". prev,. next"). fadeOut ()
});
$ (". FullSlide"). slide ({
TitCell: ". hd ul ",
MainCell: ". bd ul ",
Effect: "fold ",
AutoPlay: true,
AutoPage: true,
Trigger: "click ",
StartFun: function (I ){
Var curLi = jQuery (". fullSlide. bd li"). eq (I );
If (!! CurLi. attr ("_ src ")){
CurLi.css ("background-image", curLi. attr ("_ src"). removeAttr ("_ src ")
}
}
});
/*** Carousel effect ***/
$ (". Dtbd"). slide ({titCell: ". hd li", mainCell: ". bd ul", autoPlay: true });
/***** Scroll image ***/
$ (". Hzhb "). slide ({mainCell :". bd ul ", autoPlay: true, effect:" leftMarquee ", vis: 6, interTime: 50, trigger:" click ", prevCell :". prev ", nextCell :". next "});