简单实现js放大镜效果

本文实例为大家分享了js放大镜效果展示的具体代码，供大家参考，具体内容如下

具体代码如下:

  
  
  
    body,div,img{
      margin:0;
      padding:0;
    }
    img{
      display:block;
      border:none;
    }
    #box{
      position:absolute;
      top:20px;
      left:20px;
      width:350px;
      height:350px;
      box-shadow:3px 3px 10px 0 #111111;

    }
    #box img{
      width:100%;
      height:100%;

    }
    #mark{
      display:none;
      position:absolute;
      top:0;
      left:0;
      width:175px;
      height:175px;
      background:#000;
      opacity: 0.5;
      filter:alpha(opacity=50);
      cursor:move;

    }
    #boxRight{
      display:none;
      position:absolute;
      top:20px;
      left:380px;
      width:350px;
      height:350px;
      overflow:hidden;
    }
    
    #boxRight img{
      position:absolute;
      top:0;
      left:0;
      width:200%;
      height:200%;
    }
  


  
    
    
  
  
    
  
  

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。