JQuery условные заявления для css?

Question

Условные заявления, похоже, не работают для меня. Я пытаюсь создать набор уложенных изображений, чтобы изменить их zIndex на основе zIndex выбранного. Так что, если у меня есть несколько кнопок, чтобы вызвать несколько изображений на переднюю панель:

(предположит, что мы начали на первое изображение по умолчанию и выбрать 2-й образ)

<script> 
$(function() { 
    var z = $("#image2").zIndex; //also tried .css.zIndex; 
    $("#button2").click(function() { 
     if (z != 999) { 
      $("#image1").animate({zIndex: 0}, 1, 'linear'); 
      $("#image2").animate({zIndex: 999}, 1, 'linear'); 
     } else { 
     return false; 
     }; 
    }); 
}); 
</script> 

Проблема заключается в том, что в то время как он работает, он работает независимо от того, является ли это условие истинным или нет, поэтому, если я выберу второе изображение, а затем его снова запустим, он запустит скрипт. Теперь, прежде чем вы начинаете задаваться вопросом, почему это имеет значение, происходит нечто большее, чем просто то, что вызывает визуальные ошибки, иначе id просто оставит это на этом, но это суть.

Answer 1

Вы можете сделать что-либо:

$("#image2")[0].style.zIndex // document.getElementById(image2).style.zIndex 

или

$("#image2").css('zIndex'); 

То, что вы здесь родной JavaScript свойство геттер/сеттер зависание коллекции jQuery, и это просто не так, как это работает.

Answer 2

if ($("#image2").css("z-index") <= 999){ 
     $("#image1").animate({zIndex: 0}, 1, 'linear'); 
     $("#image2").animate({zIndex: 999}, 1, 'linear'); 
} 

надеюсь, что это работает для вас ..

Answer 3

Проверьте это, чтобы убедиться, что это работает для вас? http://jsfiddle.net/atfZn/5/