Question

我正在使用wordpress，并使用简单的逻辑进行跳转菜单链接，如下所示：

示例如下：

<div id="whatever-you-want-to-call-it">
    The content of your div here.
</div>

2）链接到您的锚点目标要链接到您的锚，只需使用：

<a href="#whatever-you-want-to-call-it">Link Text Here</a>

或者如果它在另一页上：

  <a href="pagename.html#whatever-you-want-to-call-it">Link Text Here</a>

但是它不能在另一个页面上工作。对于同一页面它已完成，但当我从另一个页面点击时，它只加载那个页面而不是使用id的那个特定部分。

Answer 1

以下是您可以尝试的示例。

将其保存为桌面上的普通test.html，然后使用浏览器打开它。

然后在网址末尾添加#get-me并重新加载页面。

我的网址如下file:///Users/ipeak/Desktop/test.html#get-me

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>animate demo</title>
<style>
.big-height {
    width:100%;
    background-color:orange;
    height:1000px;
    margin:20px;
}
#get-me {
    background-color:blue;
    margin:20px;height:500px;
    width:100%;
}
</style>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
    <a href="#get-me">click here</a>
    <div class="big-height"></div>
    <div id="get-me"><div>

<script>
$(window).load(function(){

    //alert(window.location.hash);
    $("html,body").animate({
        scrollTop: $(window.location.hash).offset().top
    },900);
});

</script>
</body>
</html>

我们在这里做的是等待页面加载。然后通过jQuery检查给定hash元素的位置并设置其位置的动画。

跳转链接不起作用

1 个答案: