將一個按鈕鏈接到另一個頁面的一部分

Question

我有一個鏈接按鈕轉到另一個頁面，它可以工作，但我希望鏈接轉到該頁面的一個特定部分。我知道我應該爲此使用jquery，由於某種原因，它不跳轉到我希望它跳到的部分。

我的按鈕鏈接：

<div class="btn_holder top-slide"><a 
    href="http://testurl.com/media#isabelo"><p class="leeu_button">READ 
    MORE</p></a> 
</div> 

我目前有srolls到頁面底部，而不是部分其中id =「isabelo」。所以這jQuery的作品，但它不是我想要的。希望你能理解。

$(document).ready(function(){ 

//check if hash tag exists in the URL 
if(window.location.hash) {   
    $("html, body").animate({ scrollTop: $(document).height() }, 1000); 
    1000);  
}  }); 

我也已經嘗試過這種（不工作）：

$(document).ready(function(){ 

//check if hash tag exists in the URL 
if(window.location.hash) {   
    $('html, body').animate({ scrollTop: $("#isabelo").offset().top }, 1000);  
} 
    }); 

的頁面即時試圖鏈接到與一個ID = 「isabelo」

<div class="content_holder terms_row" id="isabelo"> 

Answer 1

我解決了這個：

$(document).ready(function(){  
//check if hash tag exists in the URL 
if(window.location.hash) { 
setTimeout(function(){ 
    $('html, body').animate({ scrollTop: $("#isabelo").offset().top }, 
1000); 
},1000);  
    }  
}); 

使用的超時funtion加載它後位。解決:)

Answer 2

一個div

你不應該爲此需要jquery。您應該能夠通過直接的HTML鏈接到「media/pagename.html＃isabelo」。但是你錯過了頁面名稱。那個，你需要在那裏有一個NAME標籤和ID。

Answer 3

<a href="http://www.example.com/some-page-or-other.html#exactline">Click here</a> 

要跳轉到該位置應該有name="exactline"財產

Answer 4

嗯，我試過在同一個頁面，它的工作。我不是在jQuery的專家，但如果：

$("html, body").animate({ scrollTop: $(document).height() }, 1000); 

的作品，但與isabelo不，也許是因爲瀏覽器仍沒有加載HTML哪裏isabelo是。嘗試進行調試，看看您是否具有該點上的那個元素，或者它尚未加載。

我發現其他不同的是，在第一個例子，你把兩次 「1000」

$（ 「HTML，身體」），動畫（{scrollTop的：$（文件）.height（）}， 1000）; 1000）;

在第二

不

$（ 'HTML，身體'）動畫（{scrollTop的：$（ 「＃isabelo」）偏移（）頂部}，1000）。

但我認爲這是一個錯誤的複製/粘貼，因爲在第一個例子中，我沒有找到它的感覺，但它的工作原理就像你說的。

Answer 5

---

setInterval將是比setTimeout更好的方法。如果您的頁面在1秒內未加載，那麼setTimeout內的代碼將無法按預期工作。但是，如果每秒都有間隔，並且一旦獲得該元素就清除間隔，這將始終有效。

$(document).ready(function(){  
//check if hash tag exists in the URL 
if(window.location.hash) { 
a = setInterval(function(){ 
    if($("#isabelo").length) { 
     $('html, body').animate({ scrollTop: $("#isabelo").offset().top }, 
     1000); 
     clearInterval(a); 
    } 
},1000);  
    }  
});