87,907
社区成员
发帖
与我相关
我的任务
分享为什么IE6下的拖动 鼠标会不断抖动。。。。
可以看 http://willko.cn/js/pagesort.html
或者代码
如果把
with (moveBox.style) {
top = clientY - offsetY + "px";
}
这段去掉，占用CPU就没那么高。。。IE6下有问题。。
我就奇怪了，，不就是个简单的移动吗？为什么IE6下我以前写的拖动都没这个现象，而现在这个却有。。是什么原因呢？？
谢谢
或者代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
#pages {
width: 300px;
padding: 25px;
}
#pages h2 {
border: 1px solid rgb(153, 153, 153);
background: rgb(255, 255, 204);
color: #000;
width: 290px;
font-weight: bold;
}
#pages ul {
margin: 0px;
padding: 0px;
list-style: none;
border-top : 1px solid #ccc;
border-left : 1px solid #ccc;
color: #000099;
width: 300px;
font-weight: bold;
}
#pages ul li {
cursor: move;
border-right : 1px solid #ccc;
border-bottom : 1px solid #ccc;
background-color: #F5F5F5;
width: 100%;
line-height: 25px;
background: url(/javascript/dtree/img/page.gif) no-repeat left center;
text-indent: 15px;
}
#pages .moveBox {
position: absolute;
display: none;
width: 300px;
border: 1px solid #ccc;
z-index:99;
filter:alpha(opacity=60);
opacity:0.6;
-moz-opacity:0.6;
}
#pages .scapegoat {
display: none;
border-right : 1px solid #ccc;
border-bottom : 1px solid #ccc;
width: 300px;
background: #fff;
}
</style>
</head>
<body>
<script type="text/javascript" src="http://willko.cn/js/base.js"></script>
<script language="JavaScript">
function beginMove(e, currEle) {
e = e || window.event;
var cats = currEle.parentNode;
var catCount = cats.childNodes.length - 2;
var moveBox = cats.childNodes[cats.childNodes.length - 2];
var scapegoat = cats.childNodes[cats.childNodes.length - 1];
var offsetLeft = calculateOffset(currEle, 'offsetLeft');
var offsetTop = calculateOffset(currEle, 'offsetTop');
var catsTop = calculateOffset(cats, "offsetTop");
var catsHeight = cats.offsetHeight;
var offsetX = e.clientX - offsetLeft;
var offsetY = e.clientY - offsetTop;
var eleHeight = currEle.offsetHeight;
var scrollTop = document.documentElement.scrollTop;
var scrollLeft = document.documentElement.scrollLeft;
with (moveBox.style) {
left = offsetLeft + "px";
top = offsetTop + "px";
}
moveBox.firstChild.nodeValue = currEle.firstChild.nodeValue;
insertEle(currEle, scapegoat, cats);
cats.appendChild(currEle);
clsEle(currEle);
dspEle(scapegoat);
dspEle(moveBox);
addEvent(document, "mousemove", moveHandle);
addEvent(document, "mouseup", upHandle);
dontRise(e);
cancelDefault(e);
function moveHandle(e) {
e = e || window.event;
var clientX = e.clientX;
var clientY = e.clientY;
var x = clientX + scrollLeft;
var y = clientY + scrollTop;
if (y > catsTop && y < catsTop + catsHeight) {
with (moveBox.style) {
top = clientY - offsetY + "px";
}
}
var n = parseInt((y - catsTop) / eleHeight);
n = n >=0 ? n : 0;
n = n < catCount ? n : catCount;
var target = cats.childNodes[n];
if (target !== scapegoat && target.previousSibling !== scapegoat) {
insertEle(target, scapegoat, cats);
}
}
function upHandle(e) {
e = e || window.event;
delEvent(document, "mousemove", moveHandle);
delEvent(document, "mouseup", upHandle);
insertEle(scapegoat, currEle, cats);
cats.appendChild(scapegoat);
clsEle(moveBox);
clsEle(scapegoat);
dspEle(currEle);
dontRise(e);
cancelDefault(e);
}
}
//-->
</script>
<div id="pages">
<ul id="mypages"><li id="7" onmousedown="beginMove(event, this);">Menu Item 2</li><li id="3" onmousedown="beginMove(event, this);">Inquiry</li><li id="1503" onmousedown="beginMove(event, this);">Benefit</li><li id="2177" onmousedown="beginMove(event, this);">New Products</li><li id="2" onmousedown="beginMove(event, this);">Showroom</li><li class="moveBox"> </li><li class="scapegoat"> </li></ul>
</div>
</body></html>如果把
with (moveBox.style) {
top = clientY - offsetY + "px";
}
这段去掉，占用CPU就没那么高。。。IE6下有问题。。
我就奇怪了，，不就是个简单的移动吗？为什么IE6下我以前写的拖动都没这个现象，而现在这个却有。。是什么原因呢？？
谢谢
...全文
请发表友善的回复…
发表回复
用户昵称不能为空 2011-03-22
- 打赏
- 举报
我也是的。javascript代码：
/**
* Div Tabs When onmouseover
*
* @example <a href="#" target="_blank" id="a1" onmousemove="Tabs()"></a>
*
*/
function Tabs(idprefix,currid,len,css,subprefix){
css = css || "curr";
for(var i = 1; i <= len; i++){
$('#' + idprefix + i).removeClass(css);
$('#_'+ idprefix + i).hide();
if(subprefix) $('#'+subprefix+'_'+idprefix+i).hide();
}
$('#' + idprefix + currid).addClass(css);
$('#_'+ idprefix + currid).show();
if(subprefix) $('#'+subprefix+'_'+idprefix+currid).show();
}
lxjssy 2007-11-08
- 打赏
- 举报
十分感谢，我没有看到消息，不知是不是论坛的问题，不知头像有没有版权问题，呵呵。
感谢啊，那我就用在网站上了。
感谢啊，那我就用在网站上了。
willko 2007-11-07
- 打赏
- 举报
历史消息……
在2007年11月06日 16点32分56秒，lxjssy给您发送的消息！
感觉你的留言本程序不错，想用再网站上，用新的版本吗？我下载的是0.2版的，给个免费使用的许可，好吗？呵呵
在2007年11月06日 19点55分55秒，您发送给 lxjssy 的消息!
你好，你直接拿去用或任意修改。。。不过，里面用的几个头像是拿discuz里的，所以最好换掉吧。。因为工作了比较忙。。。所以我已经没更新了。。。其实这个写得很烂。
我已經給你回復了。。。````
在2007年11月06日 16点32分56秒，lxjssy给您发送的消息！
感觉你的留言本程序不错，想用再网站上，用新的版本吗？我下载的是0.2版的，给个免费使用的许可，好吗？呵呵
在2007年11月06日 19点55分55秒，您发送给 lxjssy 的消息!
你好，你直接拿去用或任意修改。。。不过，里面用的几个头像是拿discuz里的，所以最好换掉吧。。因为工作了比较忙。。。所以我已经没更新了。。。其实这个写得很烂。
我已經給你回復了。。。````
lxjssy 2007-11-07
- 打赏
- 举报
willko 在网站上使用你的留言板程序，给个免费授权 如何？谢谢了。
willko 2007-11-06
- 打赏
- 举报
如果可以的話，我想盡量知道用背景的解決辦法。。```
^-^^-^^-^^-^^-^^-^^-^^-^^-^^-^^-^
^-^^-^^-^^-^^-^^-^^-^^-^^-^^-^^-^
gzdiablo 2007-11-06
- 打赏
- 举报
实在不行就直接用图片吧 IE下的背景图效率是很糟糕
willko 2007-11-06
- 打赏
- 举报
不是很明白？
是说用JS设置吗？
我试过了。。。
是说用JS设置吗？
我试过了。。。
gzdiablo 2007-11-04
- 打赏
- 举报
不要用class 直接修改style.background属性
willko 2007-11-04
- 打赏
- 举报
睡前T下
willko 2007-11-04
- 打赏
- 举报
请看1楼。。。
tantaiyizu 2007-11-04
- 打赏
- 举报
你以前怎么写的？
willko 2007-11-04
- 打赏
- 举报
原来是背景的问题
#pages ul li {
cursor: move;
border-right : 1px solid #ccc;
border-bottom : 1px solid #ccc;
background-color: #F5F5F5;
width: 100%;
line-height: 25px;
background: url(page.gif) no-repeat left center; /* 《===== */
text-indent: 15px;
}
每次移动 IE6都重新下载page.gif......
....
请问有没解决的办法。。。
#pages ul li {
cursor: move;
border-right : 1px solid #ccc;
border-bottom : 1px solid #ccc;
background-color: #F5F5F5;
width: 100%;
line-height: 25px;
background: url(page.gif) no-repeat left center; /* 《===== */
text-indent: 15px;
}
每次移动 IE6都重新下载page.gif......
....
请问有没解决的办法。。。
