jQuery图片层叠加效果,左右按钮可切换大图,还支持索引按钮控制图片切换。
HTML
首先我们在滚动区域#scrolls放置多个图片:
<div id="scrolls" class="jcImgScroll">
<ul>
<li><a href="http://www.sucaihuo.com/" path="images/01.jpg"></a></li>
<li><a href="http://www.sucaihuo.com/" path="images/02.jpg"></a></li>
<li><a href="http://www.sucaihuo.com/" path="images/03.jpg"></a></li>
......
</ul>
</div>
接着我们引入jQuery库、jQuery-easing.js动画及jQuery-jcImgScroll.js插件:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="js/jQuery-easing.js"></script>
<script type="text/javascript" src="js/jQuery-jcImgScroll.js"></script>
jQuery
$("#scrolls").jcImgScroll({ arrow: { width: 45, height: 400, x: 60, y: 0 }, width: 330,//设置图片宽度 height: 469,//设置图片高度 imgtop: 22,//每张图片的上下偏移量 imgleft: -10,//每张图片的左边偏移量 imgwidth: 30,//每张图片的宽度偏移量 imgheight: 44,//每张图片的高度偏移量 count: 9, offsetX: 60, NumBtn: false, title: false, setZoom: .8, });
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791