Advanced Search

jQuery Disappearing Back-to-Top Link

/ Published in: jQuery
Save to your folder(s)
Courtesy Brian Cray.

Expand | Embed | Plain Text

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.