怎样用javascript实现图片漫游,该怎么处理
日期：2014-05-17 浏览次数：20853 次
怎样用javascript实现图片漫游
因为图片太大浏览不便，所以想用javascript实现能用鼠标拖动的效果
希望朋友们能提供类似的代码
------解决方案--------------------
<body onmousemove= 'doDrag(document.getElementById( 'img ')); '>
<script language=javascript>
var flag = false;
function startdrag(tag) {
flag = true;
display(flag);
}
function doDrag(tag) {
if (flag) {
tag.style.left = event.clientX - 25;
tag.style.top = event.clientY - 25;
tag.style.color= 'pink ';
}
display(event.clientX+ "| "+event.clientY);
}
function enddrag(tag) {
flag = false;
display(flag);
}
function display(str) {
document.getElementById( 'dis ').innerText = str + "\r\n ";
}
</script>
<div style= 'position:relative; ' id=img onmousedown= 'startdrag(this); ' onmousemove= 'doDrag(this); ' onmouseup= 'enddrag(this); '> <img src= ' '/> oooo </div>
<div id=dis> </div>
</body>
试一下~~~问题可能还很多~ "领会精神 "就好~~
因为图片太大浏览不便，所以想用javascript实现能用鼠标拖动的效果
希望朋友们能提供类似的代码
------解决方案--------------------
<body onmousemove= 'doDrag(document.getElementById( 'img ')); '>
<script language=javascript>
var flag = false;
function startdrag(tag) {
flag = true;
display(flag);
}
function doDrag(tag) {
if (flag) {
tag.style.left = event.clientX - 25;
tag.style.top = event.clientY - 25;
tag.style.color= 'pink ';
}
display(event.clientX+ "| "+event.clientY);
}
function enddrag(tag) {
flag = false;
display(flag);
}
function display(str) {
document.getElementById( 'dis ').innerText = str + "\r\n ";
}
</script>
<div style= 'position:relative; ' id=img onmousedown= 'startdrag(this); ' onmousemove= 'doDrag(this); ' onmouseup= 'enddrag(this); '> <img src= ' '/> oooo </div>
<div id=dis> </div>
</body>
试一下~~~问题可能还很多~ "领会精神 "就好~~
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
