0

我正在创建一个 Jimdo 网上商店。对于登录页面，我想隐藏导航栏。

我已经确定了元素的类并且可以通过 CSS 将其隐藏，但我只想将它隐藏在一页上。由于我只能将代码注入标题中，因此我需要通过选择的菜单项来识别页面。

<div class="nav">
  <ul>
    <li><a data-link-title="Home" class="active">Home</a></li>
    ...
  </ul>
</div>

当列表中的链接有和时，如何隐藏div与类？navdata-link-title="Home"class="active"

提前致谢！

4

1 回答 1

0

好的，我设法自己做到了。我想要实现的是全屏显示标题而隐藏所有其余部分，从而实现登陆页面。由于 Jimdo 将一个模板应用于所有页面，因此如果没有此解决方案，则无法达到此效果。

我确实发现了一种不同的解决方法，将一个html小部件插入到页面中img，然后将其设置为全屏并通过增加z-index. 我觉得这很丑陋，因为所有内容仍然存在并且基本上可见。它还对移动设备产生了奇怪的影响。

如果您有更好和/或更清洁的解决方案，请告诉我。希望这对某人有帮助！

$(document).ready(function() {
  if (document.getElementById("test")) {
    var theHeader = document.querySelector(".header");
    theHeader.classList.add("fullscreen");
    $('.nav').hide();
    $('.content').hide();
    $('.footer').hide();
  }
});
.nav {
  background: #ffcc00;
}
.header {
  background: #ccff00;
}
.content {
  background: #00ccff;
}
.footer {
  background: #cc00ff;
}
.fullscreen {
  min-height: 100vh;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>

<head>
</head>

<body id="test">
  <div class="nav">&nbsp;</div>
  <div class="header">&nbsp;</div>
  <div class="content">&nbsp;</div>
  <div class="footer">&nbsp;</div>
</body>

</html>

于 2016-11-08T11:55:28.627 回答