Question

我尝试使用重新加载页面来转到锚点，但页面不会重新加载或滚动到锚点。直到链接被击中才会显示锚点。

＆＃13;

$('.link').click(function() {
  $('#box').css('display', 'block');
});

＆＃13;

#box {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="box">
  <h1>Title</h1>
  <p>Description of the content.</p>
</div>
<a href="#box" class="link">Go to #Box</a>

＆＃13;

这是我博客中的页面：http://simulatorio.blogspot.com.br/p/politicas.html#cookies

例如：

我在一个小窗口中打开http://simulatorio.blogspot.com.br/p/politicas.html（宽度为500像素，显示内容）。
我在菜单中单击（内容被隐藏，菜单显示）。
我点击了链接http://simulatorio.blogspot.com.br/p/politicas.html#cookies。
页面什么都不做（它没有重新加载）!!!

我想要的是自己转到页面http://simulatorio.blogspot.com.br/p/politicas.html#cookies。

PS：仅在新窗口/标签页中打开链接时才有效。

它应该在一个小屏幕上打开，因为问题发生在那里（响应页面）。谢谢！

Answer 1

如果锚点为display:none，则导航目的也可能不存在。请尝试使用此样式：

#box {
  width:0;
  height:0;
  overflow:hidden;
}

或者：

#box {
  visibility:hidden;
}

Answer 2

它因为刷新后的样式被应用到#box所以它的隐藏。

#box {
  display: none;
}

Answer 3

你需要这样的东西：

<强> HTML：

<div id="box" class="boxContent">
  <h1>Title</h1>
  <p>Description of the content.</p>
</div>
<a href="#box" class="link">Go to #Box</a>

<强> CSS：

.boxContent {
  visibility:hidden;
}

<强> JS：

$('.link').click(function() {
  $('#box').toggleClass( "boxContent");
});

FIDDLE：http://jsfiddle.net/2TCy4/42/

ID锚点问题

3 个答案: