Tip: You can modify some of the code before running
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml> <pead> <meta http-equiv= ' content-type ' content= ' text/html;" Charset=utf-8 '/> <title>js mouse click Control dot progress Picture sliding toggle Effect </title> <style> body {text-align:left; margin:0 px font-family: "Song Body", "Arial", Sans-serif; font-size:12px;} img {border:0px}. slide_box {zoom:1; position:relative; width:981px; height:284px;}. slide2 {Overflow:hidden; wid th:981px; height:284px; #slide3wrap_box {height:134px} #slide2wrap_box {height:134px}. Slide2. Item {}. slide2. item img {width:981px; height:284px; border:0px; }. slide_btn2. btn_prevon2 {background:url (prev1.png) no-repeat; float:left; width:33px; cursor:pointer }. slide_btn2. btn_prevoff2 {background:url (prev2.png) no-repeat; float:left; width:33px; cursor:pointer PX}. slide_btn2. btn_nexton2 {background:url (next1.png) no-repeat; float: Left; width:33px; Cursor:pointer; HEIGHT:33PX}. slide_btn2. btn_nextoff2 {background:url (next2.png) no-repeat; float:left; width:33px ; HEIGHT:33PX}. slide_btn2 {margin:2px auto; width:240px; position:absolute; left:382px; top:247px; clearfix:unkno WN {clear:both;display:block;visibility:hidden;height:0px;content: "."}. Clearfix {zoom:1}. slide_dot2 {Float:le Ft margin:5px 10px; width:90px; }. Slide_dot2 span {background:url (point.png) no-repeat; float:left; margin:0px 2px; overflow:hidden; cursor:pointer ; }. Slide_dot2. dot_list {width:18px; height:18px} slide_dot2. Current {background-position: -21px-0px} </style& Gt </pead> <body> <div class= "Slide_box" > <div class= "slide2" id= "Slide3" > <div class= "Item" ></div> <div class= "item" ></div> <div class= "item" ></div> <div class= "item "></div> </div> <div class=" Slide_btn2 CleaRfix "> <span class=" btn_prevoff2 "id=" Btn_prev3 "onmouseover=" this.classname= ' Btn_prevon2 ' "onmouseout=" This.classname= ' btn_prevoff2 ' "></span> <div class=" Slide_dot2 clearfix "id=" slide_dot3 "></div" > <span class=btn_nextoff2 id=btn_next3 onmouseover= "this.classname= ' Btn_nexton2 '" onmouseout= "this.classname = ' btn_nextoff2 ' "></span> </div> </div> <script type=" Text/javascript "src=" Headtech.js "> </script> <script> var slide_03=new scrollpic (); Slide_03.id= ' slide3 ';//container ID is required parameter slide_03.previd= ' BTN_PREV3 ';//button ID (previous) slide_03.nextid= ' btn_next3 ';//button ID (next) The following are optional parameters slide_03.movenum=1;//a few cells at a time [default 1] slide_03.isloop=true;//seamless looping [default is]//slide_01.speed = 20;//speed smaller faster [ Default] slide_03.autoplay=true; Slide_03.playtime = 4000;//Auto play interval [default 5 sec] slide_03.dotid= ' slide_dot3 ';//DOT list container ID [default no point] slide_03.dotevent= ' MouseOver '//DOT toggle Event [Default Click]//slide_01.dottype= ' number ';//point type can be numeric or HTML code [default NULL] slide_03.dotclass= ' dot_list';//dot ClassName [default dot_list] Slide_03.dotclasson = ' current ';//At present point className [default =] Slide_03.init (); </script> </body> </ptml></td> </tr> </table>
Tip: You can modify some of the code before running