HTML:
< div class ="jCarouselLite" >
< ul >
< li >< img src ="image/1.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/2.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/3.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/4.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/5.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/6.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/7.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/8.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/9.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/10.jpg" alt ="" width ="150" height ="118" ></ li >
< li >< img src ="image/11.jpg" alt ="" width ="150" height ="118" ></ li >
</ ul >
</ div >
</ div >
JS:
$(".carousel .jCarouselLite").jCarouselLite({
speed: 500,
easing: "easeinout",
auto:2000,
visible: 5
});
});
样式都不用设置,都能看到效果。
上面的js部份是我在网上找到的,直接放到我的程序却遇到一个问题,怎么也动不起来,试了多种方法也不行,但下载的例子却正常。
仔细看了以下,例子中使用的是jquery1.2.3,我用的是jquery1.4.2,想着可能是对高版本的不兼容造成的。于是又去官网看了一下jcarousellite的使用说明,发现了问题所在。