@ZEAL Blog·厉
We stand alone,
TOGETHER.

可移动层的实现示例

Posted by zeal on 2005-04-28 10:15 , 3339 characters |  + 0 - 1   English
转载请保留本行原始出处声明信息 : http://www.zeali.net/entry/12 MaDe1nZEAL
标签 ( WebDev ):  ,  ,  , 
本文提供了一个通过javascript+dhtml脚本实现在IE浏览器里面显示的可以被鼠标拖动的层。这个层能够自动滚动或者被关闭,就像我的Z-Tips一样:)

Last Modified on 2007-05-24 16:35
4 条评论:
- sample2005-05-07 02:21
good article. Thx a lot.
- en () 于 2006-06-23 14:48
谢谢!这段程序是你自己写的么? 如果是的话,请联系我的邮箱:en-1982@hotmail.com
- Lee2006-11-06 09:45
正在找这样的代码,谢谢了!
- Drizzt () 于 2007-01-12 22:17
我把这个代码改写了一下,能兼容FireFox了
// begin fly bar
var bIsCatchFlyBar = false;
var cur_divX = 0;
var cur_divY = 0;

function catchFlyBar(event)
{
bIsCatchFlyBar = true;
var cursorX = event.clientX;
var cursorY = event.clientY;
cur_divX = cursorX - document.getElementById("showdiv").style.left.split("p")[0];
cur_divY = cursorY - document.getElementById("showdiv").style.top.split("p")[0];
if(isIE)
{
movediv.setCapture();
document.onmousemove = moveFlyBar;
}
else
{
window.captureEvents(Event.MOUSEMOVE);
window.onmousemove = moveFlyBar(event);
}
}

function releaseFlyBar(event){
bIsCatchFlyBar = false;
if(isIE)
{
movediv.releaseCapture();
document.onmousemove = null;
}
else
{
window.releaseEvents(Event.MOUSEMOVE);
window.onmousemove = null;
}
}

function moveFlyBar(evt)
{
if(bIsCatchFlyBar)
{
if(isIE)
{
document.getElementById("showdiv").style.left = (event.clientX - cur_divX) + "px";
document.getElementById("showdiv").style.top = (event.clientY - cur_divY) + "px";
}
else
{
document.getElementById("showdiv").style.left = (evt.clientX - cur_divX) + "px";
document.getElementById("showdiv").style.top = (evt.clientY - cur_divY) + "px";
}
}
}
Since 2005.04.27  梦想 就像鸡蛋 要么孵化 要么臭掉RSS Feed (Entries) | Back To Home | @ZEAL | 沪ICP备05024379号