JQuery $('# divOne'). animate ({zIndex: -1000}, 2000) не работает?

Я пробовал jQuery

$('#divOne').animate({zIndex: -1000}, 2000)

к этому элементу, который имеет z-индекс 1000, но он все еще находится над другими элементами?

(Если я использую firebug, чтобы изменить его на -1000, то он будет ниже других элементов)

Ответ 1

jQuery пытается добавить единицу к значению на каждом этапе анимации. Таким образом, вместо 99 это будет 99px, что, конечно, не является допустимым значением zIndex.

Невозможно установить единицу, используемую jQuery, в просто пустую строку - она либо возьмет блок, который вы включите в значение (например, 20% - percent unit), либо будет использовать px.

К счастью, вы можете взломать animate(), чтобы сделать эту работу:

var div = $('#divOne');

$({
    z: ~~div.css('zIndex')
    // ~~ to get an integer, even from non-numerical values like "auto"
}).animate({
    z: -1000
}, {
    step: function() {
        div.css('zIndex', ~~this.z);
    },
    duration: 2000
});

Для получения дополнительной информации о ~~ см. this.

Ответ 2

~~Вы не можете анимировать zindex.~~ Вы можете установить его с помощью . css.

$("#divOne").css('z-index' , '-1000');