可移动的图层
来源: 阅读:984 次 日期:2016-06-29 09:05:02
温馨提示: 小编为您整理了“可移动的图层”,方便广大网友查阅!

1、将以下代码加入到heml的<head></head>之间:

<style type=text/css>

#floater {

position: absolute;

left: 500;

top: 146;

width: 125;

visibility: visible;

z-index: 10;

}</style>

====2、将以下代码加入到heml的<body></body>之间

<div id=floater style=left: 590px; top: 158px>

<p align=center><img src=想要显示的图片.gif alt=图片显示的文字 width=125 height=60><br>

<font color=#ff8040>图片下面的文字</font></p>

</div><script language=javascript>

self.onerror=null;

currentx = currenty = 0;

whichit = null;

lastscrollx = 0; lastscrolly = 0;

ns = (document.layers) ? 1 : 0;

ie = (document.all) ? 1: 0;

<!-- stalker code -->

function heartbeat() {

if(ie) { diffy = document.body.scrolltop; diffx = document.body.scrollleft; }

if(ns) { diffy = self.pageyoffset; diffx = self.pagexoffset; }

if(diffy != lastscrolly) {

percent = .1 * (diffy - lastscrolly);

if(percent > 0) percent = math.ceil(percent);

else percent = math.floor(percent);

if(ie) document.all.floater.style.pixeltop += percent;

if(ns) document.floater.top += percent;

lastscrolly = lastscrolly + percent;

}

if(diffx != lastscrollx) {

percent = .1 * (diffx - lastscrollx);

if(percent > 0) percent = math.ceil(percent);

else percent = math.floor(percent);

if(ie) document.all.floater.style.pixelleft += percent;

if(ns) document.floater.left += percent;

lastscrollx = lastscrollx + percent;

}

}

<!-- /stalker code -->

<!-- drag drop code -->

function checkfocus(x,y) {

stalkerx = document.floater.pagex;

stalkery = document.floater.pagey;

stalkerwidth = document.floater.clip.width;

stalkerheight = document.floater.clip.height;

if( (x > stalkerx && x < (stalkerx+stalkerwidth)) && (y > stalkery && y < (stalkery+stalkerheight))) return true;

else return false;

}

function grabit(e) {

if(ie) {

whichit = event.srcelement;

while (whichit.id.indexof(floater) == -1) {

whichit = whichit.parentelement;

if (whichit == null) { return true; }

}

whichit.style.pixelleft = whichit.offsetleft;

whichit.style.pixeltop = whichit.offsettop;

currentx = (event.clientx + document.body.scrollleft);

currenty = (event.clienty + document.body.scrolltop);

} else {

window.captureevents(event.mousemove);

if(checkfocus (e.pagex,e.pagey)) {

whichit = document.floater;

stalkertouchedx = e.pagex-document.floater.pagex;

stalkertouchedy = e.pagey-document.floater.pagey;

}

}

return true;

}

function moveit(e) {

if (whichit == null) { return false; }

if(ie) {

newx = (event.clientx + document.body.scrollleft);

newy = (event.clienty + document.body.scrolltop);

distancex = (newx - currentx); distancey = (newy - currenty);

currentx = newx; currenty = newy;

whichit.style.pixelleft += distancex;

whichit.style.pixeltop += distancey;

if(whichit.style.pixeltop < document.body.scrolltop) whichit.style.pixeltop = document.body.scrolltop;

if(whichit.style.pixelleft < document.body.scrollleft) whichit.style.pixelleft = document.body.scrollleft;

if(whichit.style.pixelleft > document.body.offsetwidth - document.body.scrollleft - whichit.style.pixelwidth - 20) whichit.style.pixelleft = document.body.offsetwidth - whichit.style.pixelwidth - 20;

if(whichit.style.pixeltop > document.body.offsetheight + document.body.scrolltop - whichit.style.pixelheight - 5) whichit.style.pixeltop = document.body.offsetheight + document.body.scrolltop - whichit.style.pixelheight - 5;

event.returnvalue = false;

} else {

whichit.moveto(e.pagex-stalkertouchedx,e.pagey-stalkertouchedy);

if(whichit.left < 0+self.pagexoffset) whichit.left = 0+self.pagexoffset;

if(whichit.top < 0+self.pageyoffset) whichit.top = 0+self.pageyoffset;

if( (whichit.left + whichit.clip.width) >= (window.innerwidth+self.pagexoffset-17)) whichit.left = ((window.innerwidth+self.pagexoffset)-whichit.clip.width)-17;

if( (whichit.top + whichit.clip.height) >= (window.innerheight+self.pageyoffset-17)) whichit.top = ((window.innerheight+self.pageyoffset)-whichit.clip.height)-17;

return false;

}

return false;

}

function dropit() {

whichit = null;

if(ns) window.releaseevents (event.mousemove);

return true;

}

<!-- drag drop code -->

if(ns) {

window.captureevents(event.mouseup|event.mousedown);

window.onmousedown = grabit;

window.onmousemove = moveit;

window.onmouseup = dropit;

}

if(ie) {

document.onmousedown = grabit;

document.onmousemove = moveit;

document.onmouseup = dropit;

}

if(ns || ie) action = window.setinterval(heartbeat(),1);

</script>

更多信息请查看脚本栏目
手机网站地址:可移动的图层
由于各方面情况的不断调整与变化, 提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!

2025国考·省考课程试听报名

  • 报班类型
  • 姓名
  • 手机号
  • 验证码
关于我们 | 联系我们 | 人才招聘 | 网站声明 | 网站帮助 | 非正式的简要咨询 | 简要咨询须知 | 加入群交流 | 手机站点 | 投诉建议
工业和信息化部备案号:滇ICP备2023014141号-1 云南省教育厅备案号:云教ICP备0901021 滇公网安备53010202001879号 人力资源服务许可证:(云)人服证字(2023)第0102001523号
云南网警备案专用图标
联系电话:0871-65317125(9:00—18:00) 获取招聘考试信息及咨询关注公众号:
咨询QQ:526150442(9:00—18:00)版权所有:
云南网警报警专用图标
Baidu
map