A jquery image scrolling plug-in (up or down) code is provided for free. The jquery scrolling plug-in instance is used.
<! Doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> jquery image scrolling plug-in (up and left-side scrolling) _ bKjia. c0m </title>
<Meta http-equiv = "content-type" content = "text/html; charset = gb2312"/>
<Script src = "/demo/1/sildetab/jquery-1.2.6.pack.js" type = "text/Webpage effects"> </script>
<Script type = "text/javascript" src = "jquery. imagescroller. js"> </script>
<Style type = "text/css tutorial">
# Viewer {height: 100px; width: 300px; clear: both; overflow: hidden; border: 3px solid # e5e5e5 ;}
# Viewerframe {width: 505px; clear: both; padding: 0 ;}
# Viewer img {width: 90px; height: 90px; margin: 5px; display: inline; border: 0 ;}
# Viewer a {display: block; float: left; width: 100px; height: 100px ;}
</Style>
<Script type = "text/javascript">
$ (Function (){
$ ("# Viewer"). imagescroller ({
Next: "btn1 ",
Prev: "btn2 ",
Frame: "viewerframe ",
Width: 100,
Child: "",
Auto: true
});
});
</Script>
</Head>
<Body>
<Div id = "viewer">
<Div id = "viewerframe">
<A href = ""> </a>
<A href = ""> </a>
<A href = ""> </a>
<A href = ""> </a>
<A href = ""> </a>
</Div>
</Div>
<Span id = "btn1"> forward </span>
<Br/>
<Span id = "btn2"> backward </span>
</Body>
</Html>
Source code
Http://down.bKjia. c0m/down/code/jquery/2010/0907/20678.html
Effect preview address
Http://g.111cn.cn/javascript/js/20100907/jqueryimg/