Solved

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

Posted on 1999-01-27
6
136 Views
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>
0
Comment
Question by:adamssr
  • 2
  • 2
  • 2
6 Comments
 
LVL 4

Expert Comment

by:martinag
ID: 1845743
Use history, not window:
history.back();
history.forward();

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>

Martin
0
 

Expert Comment

by:dauma
ID: 1845744
adamssr:

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,

Shane.


0
 

Author Comment

by:adamssr
ID: 1845745
Martin:
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..
0
Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

 
LVL 4

Accepted Solution

by:
martinag earned 100 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">

Martin
0
 

Author Comment

by:adamssr
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()">
</FORM>
0
 

Expert Comment

by:dauma
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>

0

Featured Post

Best Practices: Disaster Recovery Testing

Besides backup, any IT division should have a disaster recovery plan. You will find a few tips below relating to the development of such a plan and to what issues one should pay special attention in the course of backup planning.

Question has a verified solution.

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

Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
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…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

831 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