[2 days left] What’s wrong with your cloud strategy? Learn why multicloud solutions matter with Nimble Storage.Register Now


How to window.back() and window.forward()

Posted on 1999-01-27
Medium Priority
Last Modified: 2010-04-09
This code won't work.  What am I doing wrong? I want to click one image to page back and another to page forward. (I don't want to use form buttons.)

<a HREF="#" onClick="window.back()">
<img src="images/back01.jpg"></a>

<a HREF="#" onClick="window.forward()">
<img src="images/for01.jpg"></a>
Question by:adamssr
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2

Expert Comment

ID: 1845743
Use history, not window:

I'd use BORDER="0" for the images. Also, I recommend to put the code in the HREF instead of onClick:

<a HREF="javascript:history.back()"><img src="images/back01.jpg" border="0"></a>
<a HREF="javascript:history.forward()"><img src="images/for01.jpg" border="0"></a>


Expert Comment

ID: 1845744

Where in the hell did you find window.back or window.forward?  How long have you been programming? :-)

Martin is correct, but this will work also, dude:

<A HREF="javascript:history.go(-1)"><img src="images/back01.jpg" border="0"></A>
<A HREF="javascript:history.go(+1)"><img src="images/for01.jpg" border="0"></A>

You can change the numbers to skip back or forward more spaces in history.

Hope this helps you dude,



Author Comment

ID: 1845745
You answered my question first and the 50 points are yours.  But my problem is not solved (my fault). When I inserted your code, it worked, but the onMouseOver and onMouseOut functions I was calling quit working. (I want the button to change onMouseOver).  Here is what I have now:

<a HREF="javascript:history.back()">
<ONMOUSEOVER="act('back');window.status='Back';return true">
<ONMOUSEOUT="inact('back');window.status=' ';return true">
<img src="images/back01.jpg" NAME="back" width="80" height="23" alt="Back" border="0"></a>

What do you suggest?  If you can help me with this, I'll throw in another 50 points.  Thanks..
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Accepted Solution

martinag earned 400 total points
ID: 1845746
You've written onMouseOver and onMouseOut as their own tags when they in fact are attributes to the <A> tag:
<a HREF="javascript:history.back()" onMouseOver="act('back');window.status='Back';return true" onMouseOut="inact('back');window.status=' ';return true">


Author Comment

ID: 1845747
Thanks, Martin.  I figured it out myself, but you earned the points.

P.S.  A note to Shane:  
The place in hell I found window.forward() was as follows:
<FORM NAME="input">
<INPUT TYPE="button" VALUE="Back" onClick="window.forward()">

Expert Comment

ID: 1845748
onMouseover and onMouseout are not tags.  I suppose you found these in hell, too?

How about this:

<A HREF="javascript:history.go(-1)" onMouseOver="window.status='Back'; return true;"
   onMouseOut="window.status=''"><img src="images/back01.jpg" border="0"></A>
<A HREF="javascript:history.go(+1)" onMouseOver="window.status='Forward'; return true;"
   onMouseOut="window.status=''"><img src="images/for01.jpg" border="0"></A>


Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…

656 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question