Graphics Carousel JS Code

Picture Carousel JS Code, simple and clear, can replace the Flash carousel function! &NBSP

 

<div style= "WIDTH:287PX; height:248px; Border:solid 1px #cecece; background: #F3F3F3; padding:6px;   "> <script language=" javascript "type=" Text/javascript "> var widths=287;   Wide Var heights=242; 　　　High Var counts=4; 
Number of displayed img1=new image (); img1.src= ' images/index/3.jpg ';//Picture address img2=new image (); img2.src= ' images/index/4.jpg '; 
Img3=new Image (); img3.src= ' images/index/2.jpg '; 
Img4=new Image (); img4.src= ' images/index/1.jpg '; Url1=new image (); url1.src= ' http://URL?action-viewnews-itemid-2439 ';//The URL of the picture link url2=new image (); Url2.src= ' http:// 
Url/?action-viewnews-itemid-2386-page-1 '; 
Url3=new Image (); url3.src= ' http://URL/?action-viewnews-itemid-2384-page-4 '; 
Url4=new Image (); url4.src= ' http://URL/?action-viewnews-itemid-2377-page-2 ';    
var nn=1;    
var key=0;    
function change_img () {if (key==0) {Key=1;} else if (document.all) {document.getElementById ("pic"). Filters[0]. Apply ();d Ocument.getelementbyid ("pic"). Filters[0]. Play (Duration=2);}    
Eval (' document.getElementById ("Pic '). Src=img ' +nn+ '. src ');    
Eval (' document.getElementById (' url '). Href=url ' +nn+ '. src ');    
for (Var i=1;i<=counts;i++) {document.getElementById ("XXJDJJ" +i). Classname= ' Axx ';}    
document.getElementById ("XXJDJJ" +nn). Classname= ' bxx ';    
Nn++;if (nn>counts) {nn=1;}    
Tt=settimeout (' change_img () ', 6000);}    
function changeimg (n) {nn=n;window.clearinterval (TT); change_img ();}    
document.write (' <style> ');    
document.write ('. axx{padding:1px 7px;border-left: #ffffff 1px solid;font-weight:bold;} '); document.write (' A.axx:link,a.axx:visited{text-decoration:none;color: #fff; line-height:14px;font:11px Sans-serif;    
Font-weight:bold;} '); document.write (' A.axx:active,a.axx:hover{text-decoration:none;color: #fff; line-height:14px;font:11px Sans-serif;    
Font-weight:bold;} ');    
document.write ('. bxx{padding:1px 7px;border-left: #ffffff 1px solid;font-weight:bold;} '); document.write (' A.bxx:link,a.bxx:visited{text-decoration:none;color:#fff; line-height:14px;font:11px sans-serif;background-color: #ff0000; font-weight:bold;} '); document.write (' A.bxx:active,a.bxx:hover{text-decoration:none;color: #fff; line-height:14px;font:11px Sans-serif;    
Background-color: #ff0000; font-weight:bold;} ');    
document.write (' </style> '); document.write (' <div style= "width: ' +widths+ ' px;height: ' +heights+ ' px;overflow:hidden;text-overflow:clip;"    
> '); document.write (' <div><a id= "url" target= "_blank" ><img id= "pic" style= "Border:0px;filter:progid: Dximagetransform.microsoft.wipe (gradientsize=1.0,wipestyle=4, Motion=forward) "Width= ' +widths+ ' height= ' +heights+"    
'/></a></div> '); document.write (' <div style= "Filter:alpha (style=1,opacity=10,finishopacity=80); background: #000000; width:100%- 2px;text-align:right;top:-14px;position:relative;margin:1px;height:20px;padding:0px;margin:0px;border:0px; " 
> '); for (Var i=1;i<counts+1;i++) {document.write (' <a href= ' javascript:changeimg (' +i+ '); "Id=" XxjdJJ ' +i+ ' "class=" Axx "target=" _self "> ' +i+ ' </a>");    
document.write (' </div></div> ');    
Change_img (); </SCRIPT> </div>