試圖讓這個WordPress主題滾動到當點擊一個鏈接在不同的頁面來解釋它是，如果你看一下網站

最簡便的方式ID - haloespresso.com.au/working/試圖讓這個WordPress主題滾動到當點擊一個鏈接在不同的頁面來解釋它是，如果你看一下網站

如果您點擊頂部菜單中的「菜單」選項，它會滾動到菜單ID＃pg-9-4，這正是我想要的。在其他頁面上，菜單略有不同，相同的鏈接被改爲鏈接到主頁，並在其末尾添加了＃pg-9-4。這裏的要點顯然是從另一個頁面的鏈接打開主頁，但滾動到它的菜單部分。我甚至不需要它來平滑滾動或任何東西，只要去那個地方。它看起來像是一個框架一樣，因爲它正在加載，但它一直跳到頂端。我試圖弄清楚是什麼導致它失去了這種基本的HTML（afaik）功能，並一直讓我置身於頁面的頂端......

任何幫助都會非常棒，因爲我是當涉及到除html/css和簡單的jquery之外的其他任何東西時，都會有一些小菜鳥。

來源

2016-02-06 Skarekrow73

該解決方案將創建一個功能，檢測頁面哈希和觸發滾動功能... – Aziz

任何機會，你可以幫我做到這一點？我不確定從哪裏開始。另外，頁面上顯然已經有腳本運行，它是一個很棒的WordPress主題，所以我不想打破所有我不完全理解的東西。 – Skarekrow73

我曾嘗試添加此腳本（非常通用，所以我想它可能會工作）： http://stackoverflow.com/questions/11820055/link-to-different-page-jquery-scroll-to-specific-anchor 通過以下在這個線程的意見： http://stackoverflow.com/questions/11159860/how-do-i-add-a-simple-jquery-script-to-wordpress 但它沒有工作，只是打破了頁面上的一些元素，所以我解開了對php的修改，並刪除了我創建的js文件。 – Skarekrow73

只需將錨點附加到鏈接的末尾即可。

只需將像一個鏈接：

<a href="/someotherpage.html#section4">Link to section on another page</a>

編輯：只注意到你沒有得到這個工作。你的鏈接是什麼樣子的，目標頁面上帶有ID的HTML是什麼？

來源

2016-02-06 08:49:08

OP試過這個，它不工作。 – Aziz

糟糕，我讀得太快了。：/ –

在主頁上，菜單鏈接只是「＃pg-9-4」，在其他每個頁面上，使用不同菜單的直接鏈接都遵循正確的格式「http://haloespresso.com.au/ working /＃pg-9-4「 – Skarekrow73

試試這個jQuery代碼：

$(document).ready(function() { 
    function hashScroll() { 
     // get URL Hash 
     var hash = window.location.hash; 

     // check if hash is set and not empty 
     if (hash != '') { 
     // scroll to hash ID after 10ms delay 
     setTimeout(function() { 
      $(document).scrollTop($(hash).offset().top); 
     }, 10);  
     // debugging 
     console.log(hash); 
     console.log('offset:'+ $(hash).offset().top); 
    } 
    } 
    hashScroll(); // fire hash scroll function 
});

說明：

此功能將捕獲的URL散列（www.example.com/ #hash），檢驗它是否不是空的，然後將頁面滾動到具有與10ms後的散列相匹配的ID的元素。延遲是爲了確保瀏覽器不會混淆加載過程。

來源

2016-02-06 09:10:48 Aziz

感謝堆只是爲了確認，爲了得到這個工作我把它放在一個js文件，然後這樣做： http://stackoverflow.com/questions/11159860/how-do- i-add-a-simple-jquery-script-to-word ...讓它實際起作用嗎？ – Skarekrow73

是的，你可以這樣做，我建議將它放在你已經有的腳本文件之一中爲了減少HTTP請求，例如，您可以將此代碼添加到http：// haloespresso。 com.au/working/wp-content/themes/resca/assets/js/main.min.js?ver=4.4.2 – Aziz

那我還需要搗亂php嗎？或不？ – Skarekrow73

試圖讓這個WordPress主題滾動到當點擊一個鏈接在不同的頁面來解釋它是，如果你看一下網站

回答

相關問題