首页 > 代码库 > JavaScript之放大镜效果2
JavaScript之放大镜效果2
在放大图片效果的同时，我们怎么原图和放大窗体增加间隔呢？
我们只需应用一个table就行了：
源码上：
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta http-equiv="imagetoolbar" content="no" /><link rel="stylesheet" href="http://files.cnblogs.com/files/caidupingblogs/MagicZoom.css" type="text/css" media="screen" /><script src="http://files.cnblogs.com/files/caidupingblogs/mz-packed.js" type="text/javascript"></script><style> img { border-width: 0px; } body, p { font-size: 12px; }</style><title>JavaScript之放大镜效果</title></head><body><table border="0"><tr><td><a href="http://images.cnblogs.com/cnblogs_com/caidupingblogs/828701/o_03.jpg" id="zoom1" rel="drag-mode: true; always-show-zoom: true; zoom-position: custom" title="MagicZoom: Super bike" class="MagicZoom"><img src="http://image.mamicode.com/info/201610/20180110212333606697.jpg"/></a><p>单击并且拖动盒子</p></td><td>自定义缩放窗口</td><td id="zoom1-big"></td></tr></table></body></html>鼠标单击左键移动查看效果：
<script type="text/javascript" src="http://files.cnblogs.com/files/caidupingblogs/mz-packed.js"></script><style></style> 单击并且拖动盒子 | 自定义缩放窗口 |
JavaScript之放大镜效果2
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。