8、js插件之MagicZoom.js放大镜插件
来源：互联网 发布：我们如何看待网络用语 编辑：程序博客网 时间：2024/06/09 16:39
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>MagicZoom.js放大镜插件</title>
<link rel="stylesheet" href="css/ShopShow.css" type="text/css" />
<link rel="stylesheet" href="css/MagicZoom.css" type="text/css" />
<script src="js/MagicZoom.js" type="text/javascript"></script>
</head>
<body>
<div id="tsShopContainer">
<div id="tsImgS"><a href="images/01.jpg" title="Images" class="MagicZoom" id="MagicZoom"><img width="300" height="300" src="images/01.jpg" /></a></div>
<div id="tsPicContainer">
<div id="tsImgSArrL" onclick="tsScrollArrLeft()"></div>
<div id="tsImgSCon">
<ul>
<li onclick="showPic(0)" rel="MagicZoom" class="tsSelectImg"><img height="42" width="42" src="images/01.jpg" tsImgS="images/01.jpg" /></li>
<li onclick="showPic(1)" rel="MagicZoom"><img height="42" width="42" src="images/02.jpg" tsImgS="images/02.jpg" /></li>
<li onclick="showPic(2)" rel="MagicZoom"><img height="42" width="42" src="images/03.jpg" tsImgS="images/03.jpg" /></li>
<li onclick="showPic(3)" rel="MagicZoom"><img height="42" width="42" src="images/04.jpg" tsImgS="images/04.jpg" /></li>
<li onclick="showPic(4)" rel="MagicZoom"><img height="42" width="42" src="images/05.jpg" tsImgS="images/05.jpg" /></li>
<li onclick="showPic(5)" rel="MagicZoom"><img height="42" width="42" src="images/06.jpg" tsImgS="images/06.jpg" /></li>
<li onclick="showPic(6)" rel="MagicZoom"><img height="42" width="42" src="images/07.jpg" tsImgS="images/07.jpg" /></li>
<li onclick="showPic(7)" rel="MagicZoom"><img height="42" width="42" src="images/08.jpg" tsImgS="images/08.jpg" /></li>
<li onclick="showPic(8)" rel="MagicZoom"><img height="42" width="42" src="images/09.jpg" tsImgS="images/09.jpg" /></li>
<li onclick="showPic(9)" rel="MagicZoom"><img height="42" width="42" src="images/10.gif" tsImgS="images/10.gif" /></li>
<li onclick="showPic(10)" rel="MagicZoom"><img height="42" width="42" src="images/11.gif" tsImgS="images/10.gif" /></li>
</ul>
</div>
<div id="tsImgSArrR" onclick="tsScrollArrRight()"></div>
</div>
<img class="MagicZoomLoading" width="16" height="16" src="images/loading.gif" alt="Loading..." />
</div>
</div>
</body>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>MagicZoom.js放大镜插件</title>
<link rel="stylesheet" href="css/ShopShow.css" type="text/css" />
<link rel="stylesheet" href="css/MagicZoom.css" type="text/css" />
<script src="js/MagicZoom.js" type="text/javascript"></script>
</head>
<body>
<div id="tsShopContainer">
<div id="tsImgS"><a href="images/01.jpg" title="Images" class="MagicZoom" id="MagicZoom"><img width="300" height="300" src="images/01.jpg" /></a></div>
<div id="tsPicContainer">
<div id="tsImgSArrL" onclick="tsScrollArrLeft()"></div>
<div id="tsImgSCon">
<ul>
<li onclick="showPic(0)" rel="MagicZoom" class="tsSelectImg"><img height="42" width="42" src="images/01.jpg" tsImgS="images/01.jpg" /></li>
<li onclick="showPic(1)" rel="MagicZoom"><img height="42" width="42" src="images/02.jpg" tsImgS="images/02.jpg" /></li>
<li onclick="showPic(2)" rel="MagicZoom"><img height="42" width="42" src="images/03.jpg" tsImgS="images/03.jpg" /></li>
<li onclick="showPic(3)" rel="MagicZoom"><img height="42" width="42" src="images/04.jpg" tsImgS="images/04.jpg" /></li>
<li onclick="showPic(4)" rel="MagicZoom"><img height="42" width="42" src="images/05.jpg" tsImgS="images/05.jpg" /></li>
<li onclick="showPic(5)" rel="MagicZoom"><img height="42" width="42" src="images/06.jpg" tsImgS="images/06.jpg" /></li>
<li onclick="showPic(6)" rel="MagicZoom"><img height="42" width="42" src="images/07.jpg" tsImgS="images/07.jpg" /></li>
<li onclick="showPic(7)" rel="MagicZoom"><img height="42" width="42" src="images/08.jpg" tsImgS="images/08.jpg" /></li>
<li onclick="showPic(8)" rel="MagicZoom"><img height="42" width="42" src="images/09.jpg" tsImgS="images/09.jpg" /></li>
<li onclick="showPic(9)" rel="MagicZoom"><img height="42" width="42" src="images/10.gif" tsImgS="images/10.gif" /></li>
<li onclick="showPic(10)" rel="MagicZoom"><img height="42" width="42" src="images/11.gif" tsImgS="images/10.gif" /></li>
</ul>
</div>
<div id="tsImgSArrR" onclick="tsScrollArrRight()"></div>
</div>
<img class="MagicZoomLoading" width="16" height="16" src="images/loading.gif" alt="Loading..." />
</div>
</div>
</body>
</html>
官网:https://www.magictoolbox.com/magiczoom/
阅读全文
0 0
- 8、js插件之MagicZoom.js放大镜插件
- 【js与jquery】jquery之放大镜插件源码分析
- js插件之bootstrap
- JS插件之HighSlider
- js插件之artDialog
- js之放大镜
- js案例之放大镜
- jquery插件之放大镜效果
- jQuery插件之jqzoom放大镜插件
- 5、jQuery插件之jqzoom放大镜插件
- 放大镜插件
- magiczoom放大镜手动破解
- js插件之删除确认插件
- JavaScript 图片放大镜插件 enlarge.js 以及移动版 enlarge.touch.js
- js插件
- js 插件
- js插件
- js插件
- git图形化统计工具
- 简单实用的双向电平转换电路(非常实用!)
- ubuntu没网环境安装libreoffice和unoconv，用以word转pdf用
- 【Linux\云服务器】CentOS 7.2 64位 可视化桌面的安装与卸载
- Kotlin入门教程系列（一）Kotlin HelloWorld
- 8、js插件之MagicZoom.js放大镜插件
- 纯前端JS导出数据为excel----2
- 【LeetCode】partition-list
- HTML的footer置于页面最底部的方法
- matlab 车牌识别 程序
- TEE: OP-TEE
- IT人员健康信号之大脑保养
- sqoop1.99.7create job的注意点
- spring EhCache缓存之annotation注解
