如何在鼠标上放大图像并缩小鼠标?

时间:2015-04-29 01:06:12

标签: jquery image zoom

我想在鼠标上放大图像并在鼠标按下时将其缩小。我已经尝试过插件,可以在新窗口中缩放图像的某些部分,但我不需要这些插件。我希望图像在自己的窗口上放大。请帮忙。

1 个答案:

答案 0 :(得分:0)

希望以下演示有所帮助。

<!DOCTYPE html>
<html>
<body>
<div class="normal">
<img id="p1"  src="http://www.hdwallpapersimages.com/wp-content/uploads/2014/01/Winter-Tiger-Wild-Cat-Images.jpg"     onmousedown="mouseDown()" onmouseup="mouseUp()" />
</div>
<script>
function mouseDown() {
var m=document.getElementById("p1");
m.style.width="300px";
m.style.height="400px";
}
function mouseUp() {
var m=document.getElementById("p1");
m.style.width="200px";
m.style.height="300px";
}
</script>
<style>
.normal>img
{width: 200px; height: 300px;}
</style>
</body>
</html>