Проблемы с css('display') == 'block'

[Рагер]

Вот код

$('body').on('click', function() {		   		 	
		    	if ($('.dropdown-menu').css('display') == 'block') {
		    	 	$('#pr4').css('z-index', '1');
		    	}
		    	else {
		    		 $('#pr4').css('z-index', '-1');
		    		}
		    	});

По чему то срабатывает $('#pr4').css('z-index', '-1'); всегда когда кликаешь по окну. Нужно, что бы срабатывало когда css('display') == 'block'), все остальное время $('#pr4').css('z-index', '1');

Заранее спасибо.

[рони]

Рагер,
маловато будет, в предоставленном коде ошибок нет и Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

[Рагер]

Причина использования такого кода в конфликте bootstpapa с анимацией, при использовании opacity, плывет контекст наложения и вплывающее меню оказывает под слоем <div> который ниже находится, помогает только z-index -1, но там свои проблемы. Вот и нужно что бы при включении всплывающего окна z-index становился -1, а при следующем клике по окну выключался. А код представленный сверху, срабатывает каждый раз когда кликаешь по окну и автоматом дает z-index -1, не пойму в чем причина.

[Рагер]

Причину понял, вначале выполняется скрипт, а потом бутсртап, а нужно наоборот, как сделать ума не приложу.

[Dilettante_Pro]

$('body').on('click', function() {		   		 	
		    	if ($('.dropdown-menu').css('display') == 'block') {
		    	 	$('#pr4').css('z-index', '1');
		    	}
		    	else {
		    		 $('#pr4').css('z-index', '-1');
		    		}
		    	});

Вообще-то в коде у вас все с точностью до наоборот...Если block то 1 иначе -1

[hfts_rider]

У ".dropdown-menu" точно display: block?

[Рагер]

У ".dropdown-menu" точно display: block?

Там добавляется класс open>dropdown-menu, у которого display: block. Там проблема не в функции, а в порядке выполнения и я никак не могу построить свой порядок, вот придумал немного по другому, но все равно не пашет:

var C = $.Callbacks();
		   	
		 var foc1 = $('#pr7').on('click', function(){
     		$('#pr4').css('z-index', '1');
     		return;
      	});

		var foc2 = $('#dr3').on('click', function(){
     		alert('click');
     		$('#pr4').css('z-index', '-1');
     		return;
     	});
		   
		
		var foc3 = $('#pr2').on('click', function(){
     		$('#pr4').css('z-index', '-1');
     		return;
     	
     	});
		C.add(foc1);
		C.add(foc2);
		C.add(foc3);
		C.fire(foc1);
		C.fire(foc2);
		C.fire(foc3);

Вроде и калбеки подключил и все равно не пашет не пойму почему, может кто подскажет.

[рони]

вначале выполняется скрипт, а потом бутсртап, а нужно наоборот, как сделать ума не приложу.

вариант: заменить все $ в этом коде на jQuery

[Рагер]

В принципе решил вопрос, может кому пригодится:

window.onload = function() {
    document.body.onclick = function(event) {
        var t=event.target||event.srcElement; 
         
                if (t.id=='dr3'||t.id=='pr2') {
                	
                    jQuery('#pr4').css('z-index', '-1');

                }
                 
                else {
                	
                     jQuery('#pr4').css('z-index', '1');

                    }

                }
	  }

[Рагер]

В принципе решил вопрос, может кому пригодится:

window.onload = function() {
    document.body.onclick = function(event) {
        var t=event.target||event.srcElement; 
         
                if (t.id=='dr3'||t.id=='pr2') {
                	
                    jQuery('#pr4').css('z-index', '-1');

                }
                 
                else {
                	
                     jQuery('#pr4').css('z-index', '1');

                    }

                }
	  }