js代码_js特效免费下载_JS特效代码网   网页特效   鼠标特效   js图片相册   js特效代码大全
当前位置:js代码_js特效免费下载_JS特效代码网 > 网页特效 > JS常用代码 > 图片相册

jqzoom仿京东商品详细页产品图片放大镜特效

发布时间:2015-08-26 21:30:26    您是第0位浏览者

本js特效代码兼容:ie6 、ie7 、ie8 、ie9 、ie10 、ie11 、chrome 、firefox 、opera 、safari 、 等浏览器

jqzoom仿京东商品详细页产品图片放大镜特效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">    
<html xmlns="http://www.w3.org/1999/xhtml">    
<head>    
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
<title>jqzoom仿京东商品详细页产品图片放大镜特效 - js特效代码网</title>    
<link href="css/base.css" rel="stylesheet" type="text/css" />    
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>    
<script type="text/javascript" src="js/jquery.jqzoom.js"></script>    
<script type="text/javascript" src="js/base.js"></script>    
</head>    
<body>    
<br/><br/><br/><br/><br/>    
<center>    
<div id="preview" class="spec-preview"> <span class="jqzoom"><img jqimg="images/b1.jpg" src="images/s1.jpg" /></span> </div>    
<!--缩图开始-->    
<div class="spec-scroll"> <a class="prev">&lt;</a> <a class="next">&gt;</a>    
<div class="items">    
<ul>    
<li><img alt="佳能" bimg="images/b1.jpg" src="images/s1.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b2.jpg" src="images/s2.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b3.jpg" src="images/s3.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b1.jpg" src="images/s1.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b3.jpg" src="images/s3.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b1.jpg" src="images/s1.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b2.jpg" src="images/s2.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b1.jpg" src="images/s1.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b2.jpg" src="images/s2.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b2.jpg" src="images/s2.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b1.jpg" src="images/s1.jpg" onmousemove="preview(this);"></li>    
<li><img alt="佳能" bimg="images/b2.jpg" src="images/s2.jpg" onmousemove="preview(this);"></li>    
</ul>    
</div>    
</div>    
<!--缩图结束-->    
</center>    
</body>    
</html>



放大镜 jqzoom

jqzoom仿京东商品详细页产品图片放大镜特效

jquery仿淘宝图片放大镜特效

jquery实现图片放大镜插件,鼠标悬停局部图片放大镜头显示特效

jquery实现图片放大镜效果制作变焦镜头图片放大查看特效

jquery实现input表达输入文字,文字放大镜特效

js实现图片放大镜展示特效代码

jQuery商城网站商品放大镜查看效果特效代码

js放大镜 _jquery图片放大镜特效插件_移动鼠标图片特效代码_商城源码

友荐云推荐
大家说 此评论不代表本站观点