jQuery Disappearing Back-to-Top Link


/ Published in: jQuery
Save to your folder(s)

Courtesy Brian Cray.


Copy this code and paste it in your HTML
  1. $(function(){
  2. /* set variables locally for increased performance */
  3. var scroll_timer,
  4. displayed = false,
  5. $message = $('#message a'),
  6. $window = $(window),
  7. top = $(document.body).children(0).position().top;
  8.  
  9. /* react to scroll event on window */
  10. $window.scroll(function () {
  11. window.clearTimeout(scroll_timer);
  12. scroll_timer = window.setTimeout(function () { // use a timer for performance
  13. if($window.scrollTop() <= top) // hide if at the top of the page
  14. {
  15. displayed = false;
  16. $message.fadeOut(500);
  17. }
  18. else if(displayed == false) // show if scrolling down
  19. {
  20. displayed = true;
  21. $message.stop(true, true).show().click(function () { $message.fadeOut(500); });
  22. }
  23. }, 100);
  24. });
  25. });

URL: http://briancray.com/2009/10/06/scroll-to-top-link-jquery-css/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.