跳轉鏈接不起作用
[英]Jump links are not working
問題描述
我正在使用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加載該特定部分。
1 個解決方案
解決方案1
0 已采納 2014-05-19 13:46:17
這是您可以嘗試的示例。
將其另存為桌面上的普通test.html，然后使用瀏覽器將其打開。
然后在URL末尾添加#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元素的位置，並為其設置動畫。
跳轉鏈接在我的網站上不起作用
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.