javascript - 使用 jQuery UI Draggable 时设置 z-index 在 Firefox 4 中不起作用

Question

我有 2 个可拖动的 DIV，我希望根据它们在父 DIV 中的位置堆叠它们。我尝试设置 z-index，虽然这适用于 IE 9，但我无法让它在 Firefox 4 中运行。

使用 Firebug，我看到拖动的元素的 z-index 设置为 auto。

我想在http://jsfiddle.net/a5jgm/6/上完成的完整演示

感谢您的时间

        $( ".draggable" ).draggable({
    //    zIndex: 5,
        start: function(event, ui) {
        //    console.log(this);
            var zIndex = $(this).draggable( "option", "zIndex" );
            $('#zindex').val(zIndex);
        //    $( this ).draggable( "option", "zIndex", 100 );
        },            
        drag: function( event, ui ) {                
            var pos = $( "#"+this.id).position();
            $( "#offset" ).val( ""+pos.left +" "+pos.top );
        },
        stop: function(event, ui){
            console.log(this);
            if(ui.offset.left > 220){
                var currentz = parseInt( $('#zindex').val() )+1;

                $( this ).draggable( "option", "zIndex", currentz);    
                $('#zindex').val(currentz);
                console.log(' z index is: '+$(this).draggable( "option", "zIndex" ));
            }

        }
    });
    var i = 10;
    $( ".draggable").each(function(){
        i = i +1;
        $( this ).draggable( "option", "zIndex", i );
    });

Answer 1

尝试设置位置属性。根据您的实施，将其设置为相对、绝对等合适的。这可能会解决问题。