Html Tips and Tricks

Sunday, May 23, 2004

Javascript: Back and Forward Links on Your Site

In this html tip, you can have little buttons or links which copy the functions of your browsers back and forward buttons.
Let's show you how to make buttons:
<FORM METHOD="post">
<INPUT TYPE="button"
VALUE="BACK"
OnClick="history.go( -1 );return true;">
<INPUT TYPE="button"
VALUE="FORWARD"
OnClick="history.go( 1 );return true;">
</FORM>

If you insert this code onto one line, you get this:

You can delete the forward button section and you only get a back button.
This is the code for only a back button: (remember to put it on ONE line)
<FORM METHOD="post">
<INPUT TYPE="button"
VALUE="BACK"
OnClick="history.go( -1 );return true;">
</FORM>

If you change the VALUE="BACK" to something else, too, you can get something like this:

Nice, eh?
Hyperlinks are a bit simpler:
<A HREF="javascript:history.go(-1)">Go back</A>
<A HREF="javascript:history.go(1)">Go forward</A>

That code makes this:
Go back
Go forward
Edit the code a bit after you have inserted it, and you are done with this.

NOTE: Always make sure you have the most recent browser and javascript plugins.


NEED EXTRA HELP? HAVE A SUGGESTION? HAVE SOMETHING TO ADD? PLEASE POST COMMENTS WHILE LOOKING AT ALL THESE USEFUL HTML TIPS AND TRICKS. THANK YOU!

4 Comments:

Post a Comment

<< Home


Hit Counter