jqery 实现滚动图片【三】

下载地址http://www.gmarwaha.com/jquery/jcarousellite/index.php#install
建议下载Uncompressed,里面有例子。
引入jcarousellite.js,<script type="text/javascript" src="path/to/jquery.js"></script>
<script type="text/javascript" src="path/to/jcarousellite.js"></script>
如果想添加滚轮支持,则需要引入<script type="text/javascript" src="path/to/easing.js"></script>
<script type="text/javascript" src="path/to/mousewheel.js"></script>
然后 jsp:
<div class="jCarousel">
    <ul>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
        <li><img src="someimage" alt="" width="100" height="100" ></li>
    </ul>
</div>

js:
$(".jCarousel").jCarouselLite({
    mouseWheel: true,
     auto: 800,
    speed: 1000

});

这样便实现了图片的滚动了。其中有很多属性可以自己选择。
在使用过程中遇到一个问题,div宽度不能自定义,我们可以把修改div.css(sizeCss, divSize+"px");这句代码:
1、直接注释掉
2、增加一个参数,根据该参数来判断。这样我们便可以自如的控制div的宽度或者高度了。

你可能感兴趣的:(图片)