纯JS/CSS制作的精美图片放大镜插件
<!doctype html>
<html>
<head>
<base href="http://www.etherdream.com/FunnyScript/Magnifier/" />
<meta charset="utf-8"/>
<title>Magnifier Demo</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<style>
.test
{
margin: 100px 0 0 200px;
}
.test a
{
font-size: 14px;
color: #404040;
}
.test img
{
border: #4b4b4b 1px solid;
}
</style>
</head>
<body>
<script src="Magnifier-min.js"></script>
<pre>源码：<a href="magnifier.js">magnifier.js</a></pre>
<div class="test">
<h3><a target="_blank" href="www.codesocang.com">Picture I</a></h3>
<img src="http://js.alixixi.com/test/pic1.jpg" bigsrc="test/pic1-big.jpg" />
</div>
<div class="test">
<h3><a target="_blank" href="www.codesocang.com">Picture II</a></h3>
<img src="http://js.alixixi.com/test/pic2.jpg" bigsrc="test/pic2-big.jpg" />
</div>
<div class="test">
<h3><a target="_blank" href="www.iseedy.com">Picture III</a></h3>
<img src="http://js.alixixi.com/test/pic3.jpg" bigsrc="test/pic3-big.jpg" />
</div>
</body>
</html>
相关内容推荐