在不同頁面上錨定

所以現在我有一個允許錨定的腳本，但它只能在我當前所在的頁面內工作。在不同頁面上錨定

$('.menu a').click(function(){ 
     var question = this.innerHTML; 
     var answer = $.find('dt:contains(' + question + ')'); 
     $('html, body').animate({ 
      scrollTop: $(answer).offset().top 
     }, 200); 
     return false; 
    }); 

    <div class="menu"> 
     <div> 
      <h3 class="heading"><a href="/about">About</a> <span class="expand">+</span></h3> 
      <ul class="subheader"> 
       <li><a href="/about">How Can You Help?</a></li> 
       <li><a href="/about">How can I submit a show?</a></li> 
       <li><a href="/about">Who are we?</a></li> 
      </ul> 
     </div> 

     <div> 
      <h3 class="heading"><a id="contact" href="contact">Contact</a> <span class="expand">+</span></h3> 
      <ul class="subheader"> 
       <li><a href="contact">Email</a></li> 
       <li><a href="contact">On Site</a></li> 
       <li><a href="contact">Social Media</a></li> 
      </ul> 
     </div> 
</div>

我想弄清楚的是如何改變我當前的腳本，以便我可以將自己定位到下一頁的正確位置。

例如，我目前在我的「關於」頁面上，但我在我的菜單中單擊「電子郵件」。我想要發生的是，頁面將其自身重定向到聯繫人頁面，並將其自身錨定到電子郵件所在的位置。現在，它只是把我放在頁面的頂部。

我試圖不這樣做與幾個ID的，因爲這些不是我唯一的網頁，所以它不會是最好的主意，有超過30個ID只是爲了得到這個工作。我想這是我的最後一招。

來源

2013-06-21 Justin

你可以在'href'網址中使用'#'字符嗎？ – akonsu

@akonsu這取決於。你的意思是隻有＃字符在HREF URL或將其添加到我的HREF URL？如果你的意思是後者，那麼是的，我可以。 – Justin

的問題是不明確的，但我假設你有一個JavaScript函數，它接受一個字符串並找到發送用戶的正確位置。如果你想使用<a>

<li><a href="contact#email">Email</a></li>

或者：在這種情況下，你可以在頁面加載與網頁的當前哈希運行此：

$(function() { 
    if (location.hash) { 
     var question = location.hash; 
     var answer = $.find('dt:contains(' + question + ')'); 
     $('html, body').animate({ 
      scrollTop: $(answer).offset().top 
     }, 200); 
    } 
});

和電子郵件的鏈接可以是這樣的內容哈希：

<li><a href="contact">Email</a></li> 
... 
$(function() { 
    $('a').each(function(){$(this).attr('url',$(this).attr('url')+'#'+$(this).text())}); 
});

這將打開該鏈接爲：

<li><a href="contact#Email">Email</a></li>

來源

2013-06-21 21:20:48

是的，我的功能完全按照你所說的。 – Justin

所以我有一個簡單的問題。這是否意味着最終用數十個ID來清理我的頁面是不可避免的？ – Justin

我提供的解決方案中沒有涉及的ID。 –

只是做...

<li><a href="contact#email">Email</a></li> 
<li><a href="contact#onsite">On Site</a></li> 
<li><a href="contact#social">Social Media</a></li>

然後設置頁面的youre談論

像這樣的錨....

//email section to link to 
<div id="email"></div> 
//onsite section to link to 
<div id="onsite"></div>

來源

2013-06-21 21:18:14 KyleK

問題的關鍵在於，他們不想在ID上打幾十頁垃圾。我認爲這是一個常見問題頁面，可能有幾十個問題。 –

這是我所說的最後的選擇。我想知道的是，如果有一種方法可以不使用id，因爲我試圖在地址欄中不使用#someid。這就像喬提到的那樣。我不會用幾十個ID來亂扔我的網頁。 – Justin

那麼內容將在divs反正.....你沒有添加任何東西，你只是參考內容的位置.....這不是一樣的設置這將是亂拋垃圾....這只是參考 – KyleK

在不同頁面上錨定

回答

相關問題