单击图像时如何隐藏导航栏

Question

单击图像时如何隐藏导航栏？

这是图片的代码：

 <a href="gallery/1.png" class="fancybox" rel="ligthbox">
  <img src="gallery/1.png" class="zoom img-fluid">         
 </a>

我不打算提供我尝试过的代码，因为它不清楚，我的JavaScript也不太好。

对不起，我的英语不好，希望您能理解！

Answer 1

如果您的button类是btn，而navigation bar类是navbar

使用JavaScript

var btn = document.querySelector('.btn');
btn.onclick = function() {
    var navbar = document.querySelector('.navar');
    navbar.style.display = "none";
}

使用jQuery

$('.btn').on('click', function(event) {
    $('.navar').hide();
});

Answer 2

您需要更正导航栏的z-index，以尝试减小z-index:10

附近的z-index值。