2013-01-04 320 views
-1

我正在嘗試使它在我處於頁面頂部時<DIV>不可見,但每當我滾動到它時,都會彈出一個鏈接,直接返回到頁面頂部頁。使用JavaScript會更容易嗎?還是有一種方法可以只使用HTML?隱藏div直到滾動

+1

看起來你想創建一個初始隱藏的「返回頂部按鈕」,並且有很多涵蓋該部分的問題/答案。 –

+0

我已經回到頂部的鏈接,我試圖找出如何使它在滾動時可見,而不是始終可見使用位置:固定。 – Guchie

+1

你不能用JUST HTML和CSS來做到這一點... JavaScript需要用來確定頁面已經滾動。 – rlemon

回答

4

那麼沒有辦法(我知道)做到這一點沒有Javascript。

假設HTML這樣的:

<button id="top">Top</button> 

您可以使用下面的代碼:

$(window).scroll(function() { // when the page is scrolled run this 
    if($(this).scrollTop() != 0) { // if you're NOT at the top 
     $('#top').fadeIn("fast"); // fade in 
    } else { // else 
     $('#top').fadeOut("fast"); // fade out 
    } 
}); 

$('#top').click(function() { // when the button is clicked 
    $('body,html').animate({scrollTop:0},500); // return to the top with a nice animation 
}); 

您仍然可以使用「的位置是:固定」在這裏,因爲沒有知名度,用戶無法看到或點擊。

+0

我試過這個,但它似乎只貼在頂端的右上角,似乎並沒有隱藏它。它在這裏:http://cielprince.tumblr.com – Guchie

+0

你把它放在右上角:P我會看看其餘的代碼。 '#top {position:fixed; top:0px; right:0px; z-index:-999px; }' – rlemon

+0

好的,我無法找到JS代碼去與我給你的HTML ...是甚至在那裏? – rlemon