小编给大家分享一下js怎么模拟实现淘宝网商品放大镜效果，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

创新互联建站是一家专注于成都做网站、网站建设、外贸营销网站建设与策划设计,民和网站建设哪家好?创新互联建站做网站,专注于网站建设十载,网设计领域的专业建站公司;建站业务涵盖:民和等地区。民和做网站价格咨询:028-86922220

效果图：（实例图片由自己添加）

代码如下：

 
 
 
 *{margin: 0;padding: 0;}
 #demo{width:350px;height:350px;border: 1px solid #000;position:relative;margin:100px;}
 #smil_box{width: 350px;height: 350px;position:relative;}
 #mask{width:175px;height: 175px;background:rgba(255,255,0,0.4);position:absolute;top:0;left:0;display:none;cursor:move;}
 #big_box{width: 400px;height: 400px;position:absolute;top:0;left:360px;border: 1px solid #000;overflow:hidden;display:none;}
 #big_box img{position:absolute;top:0;left:0;}