当前位置:首页 > 网页特效 > 图片代码 >

jQuery产品图片缩放切换代码

时间:2014-06-24 19:12 来源:互联网 作者:源码搜藏 收藏 推荐

  • 广告推荐
效果预览 立即下载

jQuery产品图片缩放切换代码jQuery产品图片缩放切换代码是一款点击缩略图后放大原图,可以鼠标拖动放大图,兼容主流浏览器。jQuery图片缩放缩略图点击切换 所属专题:图片代码

<!-- 代码 开始 -->
<div class="product_main">
<div class="clearfix product_main_inner" style="display: block; height: 499px;">
<div class="product_img image_zoom" id="product_img">
<div class="gallery_wrap">
<div class="gallery levelB" style="position: absolute; overflow: hidden; opacity: 1; height: 360px; width: 360px; left: 54px; top: 29.5px;"><img alt="" src="image/360x360/b01_2.jpg" style="height: 360px; width: 360px;"></div>
<div class="gallery gallery_mask" style="position: absolute; overflow: hidden; opacity: 1; display: none; height: 360px; width: 360px; left: 54px; top: 29.5px;"><img alt="" src="image/360x360/b01_2.jpg" style="height: 360px; width: 360px;"></div>
</div>
<div class="controller_wrap">
<div class="controller" style="width: 446px;">
<ul>
<li><a data-index="0" href="javascript:;" class="current"><img width="64" height="64" alt="" src="images/64x64/b01_2.jpg"></a></li><li><a data-index="1" href="javascript:;" class=""><img width="64" height="64" alt="" src="images/64x64/b02_2.jpg"></a></li><li><a data-index="2" href="javascript:;" class=""><img width="64" height="64" alt="" src="images/64x64/b03_2.jpg"></a></li><li><a data-index="3" href="javascript:;" class=""><img width="64" height="64" alt="" src="images/64x64/b04_3.jpg"></a></li>
</ul>
</div>
<a class="prev" href="javascript:;"><span>></span></a><a class="next" href="javascript:;"><span>></span></a>
</div>
<div class="close_wrap"><a class="close" href="javascript:;" style="display: none;">×</a></div>
</div>
</div>
</div>
<script type="text/javascript" charset="utf-8" src="js/imagezoom.js"> </script>
<script type="text/javascript" charset="utf-8" src="js/product_img.js"> </script>
<!-- 代码 结束 -->

本站资源仅限于学习研究,严禁从事商业或者非法活动! 源码搜藏网所有源码来自互联网转载与用户上传分享,如果侵犯了您的权益请与我们联系,我们将在24小时内删除!谢谢!

图片代码下载排行

最新文章