JavaScript+HTML5 canvas实现放大镜效果完整示例

本文实例讲述了Javascript+HTML5 canvas实现放大镜效果。分享给大家供大家参考，具体如下：

效果：

  
  
  
    #copycanvas {
      border: 1px solid #000;
      display: none;
    }
    #square {
      width: 90px;
      height: 90px;
      background-color: #cc3;
      border: 1px solid #f00;
      opacity: 0.5;
      position: absolute;
      z-index: 999;
      display: none;
      cursor: crosshair;
    }
  

感兴趣的朋友可使用在线HTML/CSS/Javascript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试一下运行效果。

更多关于Javascript相关内容感兴趣的读者可查看本站专题：《Javascript图片操作技巧大全》、《Javascript运动效果与技巧汇总》、《Javascript+HTML5特效与技巧汇总》、《Javascript图形绘制技巧总结》、《Javascript数据结构与算法技巧总结》及《Javascript数学运算用法总结》

希望本文所述对大家Javascript程序设计有所帮助。