<body onload="fin()" >
<SCRIPT language=JavaScript>
<!--
drag = 0
move = 0
function fin()
{
document.bgcolor="#fff000";
window.document.onmousemove = mouseMove;
window.document.onmousedown = mouseDown;
window.document.onmouseup = mouseUp;
window.document.ondragstart = mouseStop;
}
function mouseDown()
{
if (drag) {
clickleft = window.event.x - parseInt(blodrag.style.left) // 获取鼠标在X轴的坐标
clicktop = window.event.y - parseInt(blodrag.style.top) // 获取鼠标在Y轴的坐标
blodrag.style.zIndex += 1
move = 1
}
}
function mouseStop()
{
window.event.returnValue = false
}
function mouseMove()
{
if (move)
{
blodrag.style.left = window.event.x - clickleft // 获取鼠标在X轴的坐标
blodrag.style.top = window.event.y - clicktop // 获取鼠标在Y轴的坐标
}
}
function mouseUp()
{
move = 0
}
function bimg(pic)
{
var zoom=parseInt(pic.style.zoom, 10)||100;
//alert(pic.style.zoom);
//alert(parseInt(pic.style.zoom, 10));
//alert(zoom);
zoom+=event.wheelDelta/5;
if (zoom>0)
{
pic.style.zoom=zoom+'%';
}
else
{
return false;
}
}
//-->
</SCRIPT>
<DIV id=blodrag onmouseout=drag=0 onmouseover=drag=1
style="HEIGHT: 90px; LEFT: 10px; POSITION: absolute; TOP: 10px; WIDTH: 90px"><IMG border=0 src="010.jpg" onmousewheel="return bimg(this)">
</body>
图片随意拖动放大缩小效果 javascript 代码
3星 · 超过75%的资源 需积分: 10 111 浏览量
2009-07-27
23:32:45
上传
评论
收藏 765B RAR 举报 
.rar （1个子文件） 
实例27.图片随意拖动效果.html 1KB资源评论
tracy_yihu2014-06-08做的不错，但不是我想要的效果
tang_xyyh2012-10-15不好用，不是想要的效果- QQ_BlueBird_QQ2012-11-21不好用，不是想要的效果
龙少有约2013-06-05还好，可以用，代码也比较简洁，就是分太高了~- chunyg2013-03-11想做个拖动的效果，下载下来了，和自己预想的有区别，但是顺便也学习了下，多谢！
