Question

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

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

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

当列表中的链接包含div和nav时，如何隐藏data-link-title="Home"类class="active"？

提前致谢！

Answer 1

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

我找到的是一个不同的解决方法，将html窗口小部件插入到带有img的页面中，然后将其设置为全屏，并通过增加z-index来掩盖其余部分。我发现这很难看，因为所有内容仍然存在且基本可见。它也给移动设备带来了奇怪的效果。

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

＆＃13;

$(document).ready(function() {
  if (document.getElementById("test")) {
    var theHeader = document.querySelector(".header");
    theHeader.classList.add("fullscreen");
    $('.nav').hide();
    $('.content').hide();
    $('.footer').hide();
  }
});

＆＃13;

.nav {
  background: #ffcc00;
}
.header {
  background: #ccff00;
}
.content {
  background: #00ccff;
}
.footer {
  background: #cc00ff;
}
.fullscreen {
  min-height: 100vh;
}

＆＃13;

<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>

＆＃13;

使用jquery按某些数据属性隐藏Jimdo网站上的元素

1 个答案: