Plug-in Description: Unslider.min.js volume is only 2.56kb, but can meet most of the site's carousel requirements. Supports responsive, minimum support to IE6 (pro-Test). You can use CSS for full customization.
For the most common example of a carousel diagram, five carousel charts + dot indicator + left and right arrows.
<! ---><script src="Jquery-1.11.1.min.js" ></script><script src=" Unslider.min.js "></script>
<!--Write a point style and let the carousel look good.--><style>ul, ol {padding:0;}. banner {position:relative; overflow:auto; text-align:center;}. banner Li {List-style:none; }. Banner ul li {float:left;} #b{width:640px;} #b04. dots {Position:absolute; Left:0; Right0; Bottom20px;} #b04. Dots Li {display:inline-block; Width10px; Height10px; Margin04px; Text-indent:-999em; Border2px solid #fff; Border-radius:6px; Cursor:pointer; Opacity.4;-webkit-transition:background.5s, opacity. 5s; -moz-transition:background . 5s, opacity . 5s; Transition:background . 5s, opacity . 5s;} #b . Dots Li. active {background: #fff; opacity: 1;} #b . arrow {position:absolute; top: 200px;} #b#al {left: 15px;} #b#ar {right: 15px;} </style>
<!--Write the place where you want to turn the carousel.--><divClass="Banner" id="B04" > <ul> <li>="01.jpg" alt="" width="640" Height="480" ></li> <li>="02.jpg" alt="" width="640" Height="480" ></li> <li>="03.jpg" alt="" width="640" Height="480" ></li> <li>="04.jpg" alt="" width="640" Height="480" ></li> <li>="05.jpg" alt="" width="640" Height="480" ></li> </ul> <a href="Javascript:void (0);"Class="Unslider-arrow04 prev" >Class="Arrow" ID="Al" Src="Arrowl.png" alt="Prev" width="Height"="><"/a> <a href="javascript:void (0);" class="unslider-arrow04 Next" >class="Arrow" id="ar" src=" Arrowr.png "alt=" Next "width=" "Height=" PNs "></a></div>
<!--Finally with JS control--><script>$ (document). Ready (Function (e) {var Unslider04= $(' #b04 '). Unslider ({dots: true}), data = Unslider. Data (' Unslider '); $ ('. Unslider-arrow04 '). Click (function () { var fn = this. ClassName. Split (") [ 1]; Data04[FN] ();}); </script>
The picture is not put in .....
Simple Carousel Production