Динамически показать/скрыть верхнюю кнопку с javascript

Question

Мне сложно найти фрагмент кода Javascript, чтобы динамически показывать кнопку «Назад к началу», когда пользователь прокручивает, скажем, более 1000 пикселей. Все примеры используют jQuery, и я не могу использовать jQuery. Любая помощь будет очень оценена.

Answer 1

Установите CSS при pageOffset определенная точка (в window.onscroll случае):

window.onscroll = function() 
{ 
    if(pageOffset >= 1000) 
    { 
     document.getElementById('backToTopID').style.visibility="visible" 
    } 
}; 

что-то более полный будет:

window.onscroll = function() 
{ 
    if(pageOffset >= 1000) 
    { 
     document.getElementById('backToTopID').style.visibility="visible" 
    }else 
    { 
     document.getElementById('backToTop').style.visibility="hidden"; 
    } 
}; 

DEMO

Answer 2

JavaScr IPT с помощью Window.onscroll

var appended = false, bookmark = document.createElement("div"); 
bookmark.id = "arrowUp"; 
bookmark.innerHTML = "<a href=\"#\" title=\"Top of the page.\">&uarr;<\/a>"; 

onscroll = function() { 
    var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; 
    if (scrollTop > 500) { 
    if (!appended) { 
     document.body.appendChild(bookmark); 
     appended = true; 
    } 
    } else { 
    if (appended) { 
     document.body.removeChild(bookmark); 
     appended = false; 
    } 
    } 
}; 

источник

https://developer.mozilla.org/en-US/docs/Web/API/window.onscroll

демо ссылка

http://jsfiddle.net/MA4dC/