jQuery add class based on CSS characteristics

I am looking for a method with jQuery (or plain JS) in which to build a conditional on whether a div has a specific CSS characteristic.

For example, I want jQuery to add position:fixed to an element's CSS when another element is set 开发者_StackOverflow中文版to display:none, though change back to position:relative on the first element when the second element changes to display:block.

Any ideas?

If your change is event driven you just add the code to your event handlers so if element one is made hidden by a click - make element 2 position fixed

    $("#element_one").click(function(){
 $("#element_one").hide();
    $("#element_two").css({"position":"fixed"});
    })

if you just want to watch elements you will need timers (although I cannot really imagine a scenario where you do not trigger the change by either an event of programaticaly)

watchInterval = setInterval("watchMe()",10)

function watchMe(){
if ($("element_one").is(":hidden") ) {
 $("#element_two").css({"position":"fixed"});
}
}

$('#elOne').css('display') == 'none' ? $('#elAnother').css({'position':'fixed'}) : $('#elAnother').css({'position':'relative'});

Would that do the trick?

or perhaps :

$('#elOne').is(':hidden') ? $('#elAnother').css({'position':'fixed'}) : $('#elAnother').css({'position':'relative'});

There's not any nice way of doing this as you cannot "spy" on CSS changes, though jQuery does have a watch plugn which can monitor changes on certain properties. Your best bet is to use getComputedStyle which will get the real CSS values used for any object and act accordingly.