親DIVのどこにあるかに応じて積み重ねたい2つのドラッグ可能な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 );
});