Использование Javascript для включения и выключения наложения

Question

У меня есть div, называемый «navbar_menu». Когда вы нажимаете, я хочу, чтобы div «nav_overlay» исчезал, а затем, когда его снова щелкнули, я хочу, чтобы он исчез, чтобы не быть видимым.

В настоящее время я поставил Див «nav_overlay„на „дисплей: нет“, а затем, используя следующий JavaScript, он показывает себя, когда „navbar_menu“ щелкает

$(document).ready(function(){ 
    $(".navbar_menu").click(function(){ 
    $("nav ul").toggleClass("showing"); 
     $("#nav_overlay").fadeTo("fast", 0.8); 
    }); 
}); 

тег.“Навигационный ул «это просто меню, которое сдвигается, когда нажимается« navbar_menu ». Дело в том, что наложение покрывает контент, когда меню выйдет из меню, а затем, когда меню снова скользит, оверлей исчезает.

Я что мне нужен оператор if, проверяющий, является ли div видимым или нет? Я просто выиграл, если есть кто-нибудь, кто может помочь с лучшим решением для этого.

Большое спасибо.

Answer 1

Что-то, как это должно работать:

$("#nav_overlay").fadeToggle() 

Смотрите documentation для опций.

PS: Я полагаю, что наложение имеет необходимые стили, чтобы покрыть всю страницу позицией: исправлено или что-то в этом роде.

Answer 2

if($('#your-element').is(":visible")){ 
    // #your-element is visible. 
} else { 
    // #your-element is not visible 
} 

Это должно проверить, если что-то видно или нет, но ссылку или jsfiddle на ваш HTML, а также будет полезно.

Answer 3

Предполагая, что CSS-класс «показ» только заставляет элемент отображаться. Вы можете использовать функцию .toggle, чтобы заставить ее скрываться и снова появляться самостоятельно.

http://api.jquery.com/toggle/

http://api.jquery.com/fadetoggle/

// Will automatically hide/display element 
$("nav ul").toggle(); 

// Same as toggle but with fade effect 

$("#nav_overlay").fadeToggle("fast");