如何在鼠标向上放大图像和缩小鼠标向下时缩小图像



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

希望下面的演示有所帮助。

<!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>

最新更新