scriptaculous 拖拽问题

看上去是zindex的bug

测试环境是IE7

测试代码如下.

<html xmlns="http://www.w3.org/1999/xhtml"&gt;&lt;head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<script type="text/javascript" src="http://script.aculo.us/prototype.js"&gt;&lt;/script>

<script type="text/javascript" src="http://script.aculo.us/scriptaculous.js"&gt;&lt;/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;}

                      }
                      );
              &lt;/script&gt;






  <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 做出的辛苦工作。

解决了，
1、将dragdrop.js中的默认值zindex改为0
2、其他的按下面代码调整下。

[code="java"]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

var div_z_index=1; function zIndexAdd(divId) { var divObject=document.getElementById(divId); div_z_index++; divObject.style.zIndex=div_z_index; //请注意：这里是 zIndex 千万不要写成 z-index 否则会出错的 }

Demo 2

new Draggable('drag_demo_1',{//zindex:100, onDrag: function(event) { }, onStart: function(event) {zIndexAdd('drag_demo_1'); <pre><code>} } ); </script> </code></pre> <div id="drag_demo_3" style="width:80px; height:80px;position: absolute; cursor:move; background:#88da5d; border:1px solid #333;"></div> <script type="text/javascript"> new Draggable('drag_demo_3', { //scroll: window,zindex: 100, onStart: function(event) {zIndexAdd('drag_demo_3'); <pre><code> }, </code></pre> onEnd: function(event) { }});

[/code]

不知道为何在外面控制zindex就可以。这个我也是参考dom－drag的例子调整的。

在onEnd的时候，判断是否跟另一个重叠了，然后设置zindex不行么？

zIndex