实现jquery放大镜的两种方法-成都快上网建站

实现jquery放大镜的两种方法

jquery写的两种放大镜效果,没有使用到插件。调理和思路清晰。不是使用面向对象方式写的,初学者较容易看懂。废话不多说,看代码。图片这里就不上传了,大家自己找下。最好是找到比例的,这样效果比较好。

创新互联公司-专业网站定制、快速模板网站建设、高性价比临猗网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式临猗网站制作公司更省心,省钱,快速模板网站建设找我们,业务覆盖临猗地区。费用合理售后完善,十年实体公司更值得信赖。

 
  

css代码

*{padding: 0; margin: 0;} 
  #father .small{width: 50px; height: 50px; border: 2px solid #ccc; bottom: 0; position: absolute;} 
  #father .second{left: 70px;} 
  .third{left: 140px;} 
  #father{position: relative; top: 100px; left: 50px; height: 460px;} 
  #container{position: absolute; width: 400px; height: 400px;} 
  #container img{position: absolute; display: none;} 
 
  .shade{width: 200px; height: 200px; position: absolute; background: #000; opacity: 0.4; top: 0; 
    left: 0; display: none;} 
  .big{width: 400px; height: 400px; position: absolute; top: 100px; overflow: hidden; left: 500px; display: none;} 
  .big img{width: 800px; height: 800px; position: absolute; display: none;} 

js代码

 
   
   

网站名称:实现jquery放大镜的两种方法
分享地址:http://kswjz.com/article/gigjss.html
扫二维码与项目经理沟通

我们在微信上24小时期待你的声音

解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流