2012-07-03 71 views
2

我正在單頁網站上工作,並與<a></a>標籤有問題。使用<a></a>滾動單頁網站

我想當用戶點擊一個分區,他們會採取到頁面的不同部分。目前我有<a></a>這樣做。

'<a href="#divid">About</a>' 

css-tricks.com/examples/SmoothPageScroll/#two這是一個很好的例子我使用的滾動這個頁面

但每次我把圖像周圍的這些標籤在我的div時間所有div點擊屬​​性停止工作。 例子:

<div id="about-button" class="button"> 
    <a href="#about"><img src="images/menu-about.png" 
          alt="about" class="button"/></a> 
</div> 

我可以告訴大家,這是由於a標籤正對DIV的頂部發生。

我的問題是有沒有辦法使<a>標籤坐下或與div並排工作,仍然工作?

或者如果沒有辦法做到這一點。任何閱讀中,我可以做什麼或更好的方法的例子導航到頁面的特定部分用了使用'標籤的

+0

我有這樣做的標籤* – matt23

+0

而不是'#'(因爲你已經標記了這個jQuery),你可以使用['scrollTop()'](http://api.jquery.com/scrollTop /)滾動到正確的位置。 – Rup

+0

@ matt23:如果您向我們提供更多代碼,那將會很好。像jQuery代碼,甚至更好的一些'小提琴'。 – void

回答

3

你可以嘗試這樣的事:

$('a').click(function(e) { 
    e.preventDefault(); 
    var scr = $('#target').offset().top; // top offset of the target element 
    $('html, body').animate({scrollTop: scr}, 1000) 
}) 

DEMO

+1

對不起所有人我的英語不是很好生病嘗試重組我的問題,並再次詢問 – matt23

+0

@ matt23沒關係,你的意思是這樣的嗎? http://jsfiddle.net/UdK4h/1/ – undefined

+0

http://css-tricks.com/examples/SmoothPageScroll/#two這是一個很好的例子,我用滾動通過頁面 – matt23

1

而不是試圖操縱DOM元素的工作方式,改變你的jQuery選擇器會不會容易得多? http://api.jquery.com/parent-selector/

+0

你的意思是把div的click handers附加到錨點上? – Rup

+0

@Rup是的,那正是我的意思。 – smilebomb

相關問題