本文实例讲述了jquery图片滚动放大效果。分享给大家供大家参考。具体如下：
这是一款基于jquery实现图片滚动放大效果代码，带有左右箭头，适合用于产品展示，便于用户浏览产品细节，是一款非常实用的特效代码。
运行效果图： ———————-查看效果 下载源码———————–
小提示：浏览器中如果不能正常运行，可以尝试切换浏览模式。
为大家分享的jquery图片滚动放大效果代码如下
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery图片滚动放大效果</title>
<link href="css/zzsc.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"></script>
</head><body>
<div class="sliderbox">
<div id="btn-left" class="arrow-btn dasabled"></div>
<div class="slider">
<ul>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/go-launcher-ex.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/go-sms.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/imgwww20120104173328332830083.png"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/imgwww20120222114514451461239.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/ggbook.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/imgwww20120621153035303523388.png"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/lianxiren.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/go-touch.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/3g-android-market.jpg"/></a></li>
<li><a href="//www.jb51.net/" target="_blank"><img src="images/3ggoucai.jpg"/></a></li>
</ul>
</div>
<div id="btn-right" class="arrow-btn"></div>
</div>
<script type="text/javascript">
var $slider = $('.slider ul');
var $slider_child_l = $('.slider ul li').length;
var $slider_width = $('.slider ul li').width();
$slider.width($slider_child_l * $slider_width);
var slider_count = 0;
if ($slider_child_l < 6) {
$('#btn-right').css({cursor: 'auto'});
$('#btn-right').removeClass("dasabled");
