看上去是zindex的bug
测试环境是IE7
测试代码如下.
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://script.aculo.us/prototype.js"></script>
<script type="text/javascript" src="http://script.aculo.us/scriptaculous.js"></script>
<title>Demo 2</title></head><body>
<script type="text/javascript">
new Draggable('drag_demo_1',{zindex:100,
onDrag: function(event) {
//alert($('drag_demo_1').style.zindex);alert($('drag_demo_3').style.zindex);
},onStart: function(event) {$('drag_demo_1').style.zindex = 2000;}
} ); </script>
<script type="text/javascript">
new Draggable('drag_demo_3',
{ scroll: window,zindex: 100,
onStart: function(event) {$('drag_demo_3').style.position = 'absolute';},onEnd: function(event) {$('drag_demo_3').style.zindex = 10; }});
</script>/body></html>
上面页面运行会出现绿色和蓝色方块,可以随意拖拽.我希望能够随意调整两个拖拽层的上下位置.现在只能固定在绿上,蓝下的位置,反过来不行.
虽然Draggable有zindex属性,不过没有任何用处,在callback函数中尝试调整zindex,同样也没有任何作用.
这个地方,除了调整zindex 来控制显示上下位置之外,还有什么办法?
问题补充:
这个怎么被移动到这里来了,实际上我已经解决这个问题了
出现这个问题的原意是:
1.div的定义顺序有关,而且都是z-index为0
2.拖拽结束之后并不修改原div的z-index值,所以在前面的一直在前面。
3.拖拽的几个回调函数中无法修改对应div的z-index值,因为回调函数调用结束之后,后面还有代码会执行,会把新建拖拽对象的时候div的初始z-index值设置回去。
4.拖拽代码中设置的zindex值只是在拖拽过程中有效,放下来了,起作用的还是原先的div zindex值
不过还是感谢 hanjs 做出的辛苦工作。