|
锁定老帖子 主题：js实现拖动层，兼容IE/FireFox
精华帖 (0) :: 良好帖 (0) :: 新手帖 (16) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2010-01-25
一般情况下都不能直接这样去做的，可以先多做一个层，一外面的那个层里直接写移动脚本！ 这样才是好的，
|
| 返回顶楼 | |
|
发表时间：2010-01-25
zhengyutong 写道 很不错，不过我发现了一个问题。
在IE和FF中都会发生这样的情况，即鼠标移动速度稍快时，那个层就卡在某个地方不动了，然后你在层外松开鼠标。接着，鼠标再移到层上时，那个层又吸到鼠标上了，此时你的鼠标跟本没down，还是up的，这样你就可以移动鼠标而不是拖动便可以改变层的位置。 |
| 返回顶楼 | |
|
发表时间：2010-01-25
搭车放个jQuery的吧
(function($){
$.dragInit = function(c) {
var trigger = c.trigger ? c.trigger : c.target;
var target = c.target;
if(!target)
return;
trigger.css('cursor', 'move');
var d = $(document);
trigger.mousedown(function(e){
var positionX = e.clientX - target.offset().left;
var positionY = e.clientY - target.offset().top;
d.mousemove(function(e){
target.css({
position: 'absolute',
left: e.clientX - positionX,
top: e.clientY - positionY
});
});
d.mouseup(function(){
d.unbind('mousemove');
d.unbind('mouseup');
});
});
}
}(jQuery));
|
| 返回顶楼 | |
|
发表时间：2010-01-26
zhengyutong 写道 很不错，不过我发现了一个问题。
在IE和FF中都会发生这样的情况，即鼠标移动速度稍快时，那个层就卡在某个地方不动了，然后你在层外松开鼠标。接着，鼠标再移到层上时，那个层又吸到鼠标上了，此时你的鼠标跟本没down，还是up的，这样你就可以移动鼠标而不是拖动便可以改变层的位置。 我没出现这个问题，谢谢你发现问题，但是我怎么移鼠标都没有出层，可以把鼠标的up事件写在document中，这样就好了吧，再次感谢 |
| 返回顶楼 | |
|
发表时间：2010-01-26
elvishehai 写道 一般情况下都不能直接这样去做的，可以先多做一个层，一外面的那个层里直接写移动脚本！ 这样才是好的，
一般是不这样写，呵呵 ，谢谢你的建议 |
| 返回顶楼 | |
|
发表时间：2010-01-26
寄生虫 写道 搭车放个jQuery的吧
(function($){
$.dragInit = function(c) {
var trigger = c.trigger ? c.trigger : c.target;
var target = c.target;
if(!target)
return;
trigger.css('cursor', 'move');
var d = $(document);
trigger.mousedown(function(e){
var positionX = e.clientX - target.offset().left;
var positionY = e.clientY - target.offset().top;
d.mousemove(function(e){
target.css({
position: 'absolute',
left: e.clientX - positionX,
top: e.clientY - positionY
});
});
d.mouseup(function(){
d.unbind('mousemove');
d.unbind('mouseup');
});
});
}
}(jQuery));
JQuery很强大，但是我还不会，你的代码我收下了，好好研究下，谢谢 |
| 返回顶楼 | |
|
发表时间：2010-01-26
jquery 的ui早就实现可拖动的层了，只要将js文件包含进来 一句话搞定。
如果要实现这样的功能 ，建议各位看下jquery 挺好用。 上手容易 是哟个简单。对dom操作方便极了 |
| 返回顶楼 | |
|
发表时间：2010-01-27
jQuery的ui很强大啊，不过通过lz这样的小例子来学习js也挺不错的，昨天修改了一个可拖动单元格的table，学到不少东西
|
| 返回顶楼 | |
|
发表时间：2010-01-27
为啥我在IE下验证不通过，IE7/IE6都不行，firfox是能可以的！
|
| 返回顶楼 | |
|
发表时间：2010-01-28
寄生虫 写道 搭车放个jQuery的吧
(function($){
$.dragInit = function(c) {
var trigger = c.trigger ? c.trigger : c.target;
var target = c.target;
if(!target)
return;
trigger.css('cursor', 'move');
var d = $(document);
trigger.mousedown(function(e){
var positionX = e.clientX - target.offset().left;
var positionY = e.clientY - target.offset().top;
d.mousemove(function(e){
target.css({
position: 'absolute',
left: e.clientX - positionX,
top: e.clientY - positionY
});
});
d.mouseup(function(){
d.unbind('mousemove');
d.unbind('mouseup');
});
});
}
}(jQuery));
能否解释一下代码？ |
| 返回顶楼 | |
