Go top button function

Posted under » JavaScript on 5 April 2011

Sometimes your page get's too long, like this page for eg. It is a good idea to have a "go to top" button. This is a javascript version. The script does this

How to do it.

Put the following on your header

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
Also this
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.anoneh.com/js/scrolltopcontrol.js"></script>

Where ajax.googleapis library can be any version you wish.

Perhaps you want to change the img url specified in "scrolltopcontrol.js". You don't have to do anything else. Just ensure your js and images folder are valid.

There are times where you just want to go up without pressing the up arrow. This is what you should put in your JS script.

$("a[href='#top']").click(function() {
  $("html, body").animate({ scrollTop: 0 }, "slow");
  return false;

web security linux ubuntu GIT svn Raspberry apache mysql php drupal cake symfony javascript Ajax css