Changing BACK button nature

Rush507 · Apr 30, 2008

Hello
I'm in this project where my boss wants me to change the behaviour of the back button so that instead of jumping to the previous url it un-does the effect.

I'll explain better

1. you click on a top menu and then you slowly scroll down to a certain part of the webpage. then you hit the browser's back button and you scroll up to the top.

2. you click on a picture and a lightbox comes up showing you the picture. then you click on the browser's back button and fade out the picture and keep in the page.

I've stated them that I just cannot change it's nature of going back to the previous item in the history.

But I want some comments about you to see if I'm right or wrong. (If wrong, gimme a hint so I can do it)

kaht · Apr 30, 2008

You're right. Tell them kaht said so.

-kaht

Lisa, if you don't like your job you don't strike. You just go in every day and do it really half-assed. That's the American way. - Homer Simpson

[small] <.[/small]

BillyRayPreachersSon · Apr 30, 2008

If you want to change the back button functionality, you'll have to write your own browser.

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

adam0101 · Apr 30, 2008

I think trying to change the behavior of something everyone is familiar with is a very bad idea. But if you really need to do this, you could attempt something like this: (I was really bored)
[ul][li]Create an array to track the user actions you want to be able to undo. [/li]
[li]After every action, change the location of a hidden Iframe to add an entry in the browser's history.[/li]
[li]In the Iframe's page load event, run a function that will either undo or redo the actions.[/li]
[/ul]

Here's what I had so far. [red]Warning![/red] The following code is complete garbage and doesn't work quite right. I'm just posting it here to steer you in the direction you want to go.

This is the content of the hidden iframe's pages. I needed two pages (a.html and b.html) and switch back and forth between them otherwise IE wasn't adding an entry in the history.

Code:

<body onload="parent.undoAction()"></body>

And here's the main page.

Code:

<script>
var ifrmPage;
var actions = [];
var lastActionIndex = 0;

function scrollPage(){
  alert("Page Scrolled");
}

function scrollPageUndo(){
  alert("Undo Page Scrolled");
}

function showImage(){
  alert("Image Shown");
}

function showImageUndo(){
  alert("Undo Image Shown");
}

function doAction(action){
  ifrmPage = ifrmPage == "a" ? "b" : "a";
  actions[actions.length] = action;
  window[action]();
  window.frames.ifrm.location.href = ifrmPage + ".html#" + (actions.length - 1);
  lastActionIndex = actions.length - 1;
}

function undoAction(){
  var hash = window.frames.ifrm.location.hash;
  if(hash.length > 0){
    var actionIndex = hash.substring(1);
    if(actionIndex < lastActionIndex){
      var undoAction = actions[lastActionIndex] + "Undo";
      window[undoAction]();
      lastActionIndex = actionIndex;
    }
  }
}

</script>
<body>
<a href="javascript:doAction('scrollPage')">Scroll Page</a>
<a href="javascript:doAction('showImage')">Show Image</a>

<iframe name="ifrm" src="b.html"></iframe>
</body>

Again, I don't think you should do this. I just worked on it a little to see if it was possible. Use this junk code at your own risk.

Adam
http://adameslinger.blogspot.com/

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Changing BACK button nature

Rush507

Programmer

kaht

Programmer

BillyRayPreachersSon

Programmer

adam0101

Programmer

Similar threads

Part and Inventory Search

Sponsor