Question

当mega菜单处于活动状态时，我正在尝试覆盖整页。我正在尝试这样的事情：

function overlay_toggle() {

        if ($('.mega-sub-menu').css("visibility") == "hidden") {

            $('#twc-page-overlay').css({ "visibility": "hidden" });
        }

        else {
            $('#twc-page-overlay').css({ "visibility": "visible" });
        }

    }

目前正在做这项工作。我在这里缺少什么想法？

谢谢！

HTML就像这样：

<header>
   <nav>
      <ul>
         <li>
            <ul class="mega-sub-menu"></ul>
         </li>
      </ul>
   </nav>
</header>

<div id="twc-page-overlay"></div>

Answer 1

这不会奏效，只需使用Record.distinct('username', function(err, usernames){ if (err) console.log(err); else { // sort the username, then pop the last name var un = usernames.sort().pop(); var reg = /\d+/g; // get the current max number in username, var num = parseInt(un.match(reg)[0]); var newusername = 'John' + (++num); // insert new username record var r = new Record({username: newusername}); r.save(function(err) {}); } });检查可见性，.is(":visible")使其可见，.show()隐藏

＆＃13;

.hide()

＆＃13;

if ($('.mega-sub-menu').is(":visible") === false) {
  $('#twc-page-overlay').hide();
} else {
  $('#twc-page-overlay').show();
}

＆＃13;

Answer 2

你可以用一行写出来：

$('#twc-page-overlay').toggle($('.mega-sub-menu').is(':visible'));

如果你想使用visibility而不是display，你可以使用toggleClass做同样的事情：

.hidden { visibility: hidden; }

$('#twc-page-overlay').toggleClass('hidden', $('.mega-sub-menu').is(':hidden'));

.toggleClass（）和.toggle（）都接受一个布尔值来分别应用/删除或显示/隐藏。

Jquery如果可见则显示另一个div，否则隐藏

2 个答案: