i have a lot of containers in my page, the user want to be able to close then using the ESC key.
is there any dynamic way to identify what containers its first ( like, highest z-index ), in case that i have more then one opened?
the way i'm doing this its very funny/ugly.
i'm reinvented the wheel, i think .
my js:
$(document).bind('keydown', function(e) {
if (e.which == 27) {
if($(开发者_如何转开发"#container1").css("display") == "block"){
// this is a sub-container inside the container1
if($("#subContainer1").css("display") == "block"){
$("#subContainer1").fadeOut();
}else{
$("#container1").stop(true,true).fadeOut('fast');
}
}else if($("#container2").css("display") == "block"){
// this is a sub-container inside the container2
if($('#subContainer2').css("display") == "block"){
$("#subContainer2").fadeOut();
}else{
$("#container2").stop(true,true).fadeOut('fast');
}
}
}
});
have any other intelligent way to do this ?
thanks!
Search through all of the containers. Find the one with the highest z-index. Hide that one when the keydown event fires.
$(document).bind('keydown', function(e) {
if (e.which == 27) {
zindex = 0;
zelem = null;
$('.container').each(function(){
thisindex = $(this).css('z-index');
if(thisindex > zindex) {
zindex = thisindex;
zelem = $(this);
}
});
zelem.hide() // or whatever
}
}
i made some change's:
$(document).bind('keydown', function(e) {
if (e.which == 27) {
eventHold = null;
$('.escSuporKey').each(function(){
thisdisplay = $(this).css('display');
if(thisdisplay === "block") {
eventHold = $(this);
}
});
eventHold.fadeOut() // or whatever
}
});
精彩评论