14 Replies - 2003 Views - Last Post: 21 January 2013 - 07:13 AM

#1 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Jquery browsers' back button behaviour

Posted 21 January 2013 - 01:43 AM

I've created a website for a high-end audio company. On the products page I use some jquery sliders.

Now, when you've clicked some buttons on the products page, and then you use the browsers' back button it goes back to all the states (expanded, collapsed) of that page. What I really want is to go back to the previous page (e.g. index.php).

Is there a way to force the backbutton to point a particular url? Even a fixed url (index.php) would do (if the history(-1) is impossible).

Thank you all. Please have a look at http://www.mystere-eu.com
Click on 'Products', and choose one ('details' button) and then try the back button of your browser.

I'd really appreciate your help

Is This A Good Question/Topic? 0
  • +

Replies To: Jquery browsers' back button behaviour

#2 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3480
  • View blog
  • Posts: 11,844
  • Joined: 12-December 12

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 02:15 AM

Your details buttons are A-links with href="#". This means when they are clicked they are treated as links that were followed (and create a history) even though you are using jQuery to over-ride the link-behaviour.

They don't need to be links. Just use SPAN or DIV, etc., with :hover, etc., in the css, if required.
Was This Post Helpful? 0
  • +
  • -

#3 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 02:21 AM

Thank you Andrew! I'll try that today.
Was This Post Helpful? 0
  • +
  • -

#4 raghav.naganathan  Icon User is offline

  • Perfectly Squared ;)
  • member icon

Reputation: 408
  • View blog
  • Posts: 1,440
  • Joined: 14-September 12

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 02:47 AM

Well, if you want to redirect the page to a specific url like index.php, then you can use the header like this.
header("location:index.php");


regards,
Raghav
Was This Post Helpful? 0
  • +
  • -

#5 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 04:05 AM

Andrew,

so I removed all the links, and assigned the jquery commands to the divs. Still no luck.
Was This Post Helpful? 0
  • +
  • -

#6 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3480
  • View blog
  • Posts: 11,844
  • Joined: 12-December 12

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 04:51 AM

You have a history.js file with approx. 2000 lines of code that plays with the browser history.
Was This Post Helpful? 0
  • +
  • -

#7 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 05:10 AM

My mistake Andrew (this .js file was from an earlier 'work around' that didn't work).
It's been removed now, but still no luck.
Is there a way to alter the browser's history list with Javascript?
Was This Post Helpful? 0
  • +
  • -

#8 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3480
  • View blog
  • Posts: 11,844
  • Joined: 12-December 12

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 05:22 AM

View Postivanhaentjens, on 21 January 2013 - 05:10 AM, said:

My mistake Andrew (this .js file was from an earlier 'work around' that didn't work).
It's been removed now, but still no luck.
Is there a way to alter the browser's history list with Javascript?


Well that file tells you that, yes! Javascript can modify the browser's history. Mozilla link.

You could post the specific code that runs when the details button is clicked (I gave up hunting for it). It seems to be doing something odd as I can see that the address flashes with a number 1 attached to the end. Perhaps some weird trick to persuade it to scroll (navigating to id #1 and then removing this 1 from the url).
Was This Post Helpful? 0
  • +
  • -

#9 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,236
  • Joined: 08-June 10

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 05:23 AM

View Postivanhaentjens, on 21 January 2013 - 01:10 PM, said:

Is there a way to alter the browser's history list with Javascript?

partly, but heavily restricted due to security concerns (user profiling and such).
Was This Post Helpful? 0
  • +
  • -

#10 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 3480
  • View blog
  • Posts: 11,844
  • Joined: 12-December 12

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 05:24 AM

BTW I wouldn't play with the browser history, just find out why its creating additional history-entries. It may even be that it is going back but PHP is sending it forward again..

This post has been edited by andrewsw: 21 January 2013 - 05:25 AM

Was This Post Helpful? 0
  • +
  • -

#11 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 05:39 AM

url products.php stays 'steady' now when clicking (no hashes of number-trails anymore)

still no luck

BTW: guys, your generosity strikes me.
Whatever you do comes back to you, they say.
May that be the case for you :-)

When you click the upper detail button, the following gets executed:

$("#ampsone .btndetails").click(function(){	
					
					$(".ampexpanded").hide();
					$(".ampcollapsed .amptext").css("color","#666");
					$(".ampcollapsed").show();
					
					$("#ampsone").hide(function() {
							$("#ampsone-expanded").slideDown('normal', function(){
							$("#ia11images").attr('src', 'imagesia11.php');					
							$('html, body').animate({ scrollTop: $('#ampsone-expanded').offset().top }, 'slow');

							});
					});
 			});


in other words = collaps all open divs, open the current one you clicked, and scroll to top

This post has been edited by Dormilich: 21 January 2013 - 05:41 AM
Reason for edit:: please use [code] [/code] tags when posting code

Was This Post Helpful? 0
  • +
  • -

#12 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3541
  • View blog
  • Posts: 10,236
  • Joined: 08-June 10

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 05:42 AM

View Postivanhaentjens, on 21 January 2013 - 01:39 PM, said:

When you click the upper detail button, the following gets executed:

that is certainly not the responsibility of the browser history.
Was This Post Helpful? 0
  • +
  • -

#13 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 06:18 AM

ok, when i comment out

//$("#ia11images").attr('src', 'imagesia11.php');

all works fine. What this does is change the iframe source to a php file imagesia11.php

That iframe contains the product slide show (and i don't want to run all hidden slide shows too),
so for the collapsed divs the src is set to emptywhite.php en for the expanded one to imagesia11.php, or imagesia12.php, ...

It's now commented.

So, does this mean that changing the src of an iframe adds a new entry in the browsers history?
Was This Post Helpful? 0
  • +
  • -

#14 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 06:53 AM

Don't know how to solve it, but I can clearly see what's going on now:

when page loads : the emptywhite.php page is loaded in the iframe

when you click on the upper details button: the src of the iframe is set to imagesia11.php

when hitting the browser back button, not the products page but the iframe page goes back in history (to emptywhite.php)
Was This Post Helpful? 0
  • +
  • -

#15 ivanhaentjens  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 8
  • Joined: 21-January 13

Re: Jquery browsers' back button behaviour

Posted 21 January 2013 - 07:13 AM

Solved!

So I changed all iframes to div's and I use the load command (instead of src attr)

$("#ia11images").load("imagesia11.php");

Well, I learned something. I hope you did too, so I didn't waste your time.

Ivan
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1