I need to prevent browser from snapping to previous scroll position when the user pushed a back button like this:
<a href="javascript:history.go(-1)"
onClick="javascript:history.go(-1)" title="< GO BACK"></a>
after pushing that button the browser will return to the previous scroll position on this page
i want to stop that behavior and just load the top of the page.
Hope someone know a proper solution.
-exemple-
open a page scroll down go to a new page and hit the back button the page will auto scroll down to the place you scrolled before!
I'm fairly certain the behavior you're describing is is best classified as one of those things considered to be a user preference. (One of those things that you're not meant to tamper with)
#mrtsherman came up with a hack/workaround for this, but unless it's seriously breaking your webapp's usability, I think you should let the browser behave as the user would normally expect it to behave (and scroll to the position they were in when they left the page). Be sure to upvote mrtsherman for his sweet nugget of js if you use it.
I have the same problem and I haven't find yet the correct solution,
but I can give you a very good workaround for this problem.
Just scroll to the top before load the next page.
When the user click back, the browser will scroll to the top.
Example:
First Page:Next
Second Page:Back
Note that href="page1.htm" loads only if user select open in new window/tab
Excuse my English. I hope this helps.
I found a better solution!
Put the following code on every page:
<script>
setTimeout('window.scrollTo(0, 0);', 1);
</script>
Related
I don't think this is possible, but perhaps someone knows of a way. I know Gleam.io is doing something similar, so maybe there is a way.
I have a button that if you click it, it opens somesite.com. The user clicks a button and I open this page with javascript. The problem is, after clicking the button, I want to know for sure the user opened the page. Maybe even go as far as making sure he scrolled to the bottom.
Is this in any way possible? Keeping mind that the target URL can vary.
You can user 'mixpanel.com' for track the user and also put a scroll event with particular width and add that user in database or use any platform like 'mixpanel' for track the user.
It's possible to show some message on the page when you set mouse cursor on the browser back button? I don't want to use window.onbeforeunload, because it's irritating. I use ajax and I want to inform users that if they want to go back to the previous page on my web portal they should use a different button.
Is it possible to do it?
Thanks for your help
It is not possible to handle the mouse moving on the browser buttons, these are not part of the DOM that your scripts can handle.
There is an answer available here, which proposes a way of preventing users going back through the browser's back button.
I have a situation where you scroll down a page to a certain button that clicked will lead to a new page (in the same window).
If inside the new page I implement another button that via JS returns to the starting page using history.back() it has the benefit that the user lands on the exact (scrolled down) point where he clicked the first button.
New situation:
I’d love to keep this benefit, but I can’t use history.back() instead I have to use the src of the original page. Doing so by f.e. using window.location.href = "my_starting_url"; it goes back to the original page but at the top of the page. Why? Is there a simple method to achieve the same behavior as history.back() i.e. reopening the page at the same (cached) point?
Did I explain myself sufficiently?
Thank you so much in advance!
The way I see it the best option would be the History API ( http://diveintohtml5.info/history.html ): This will allow you to fetch a new page and store the scroll position of the current one, once the user clicks on "back" you can load the previous page and set the scroll position exactly where it was.
I'm using ASP.Net/VB. The problem is that I have some floating DIVs that make you want to hit back in your browser to close the floating DIV instead of clicking close.
My idea is that when you click a button on the page to open a form in a floating DIV, it adds a browser history entry for "#" if the most recent history isn't already "#". When you close the form on the floating DIV, delete the browser history for "#" that we added. If the user accidentally hits back while the form is displayed, they should remain on the page because it should try to go to "#". The form itself would disappear, and if the user hit back in the browser again, it would just work just fine.
If you know this is possible, let me know and I can figure out how to do it myself, I just don't want to spend too much time attempting to do something that's not possible.
I would consider looking into the History API and more specifically, pushState() within javascript. I've been using it and it's so much better plus search engines like it.
history.pushState(null, null, '/page.aspx?showform')
This allows you to change the URL without a refresh and you can do away with the hashes. Back/forward works fine.
This page sums it up nicely: http://diveintohtml5.info/history.html
I decide to make my own "neverending" scroll page which suits exactly my needs rather than making comfortable with some extensive classes that could not have to work exactly the way I would like them to.
Now, when all works like a charm, last thing remains. Preserve the scroll position when the browser's back button is hit. Every time you get to the bottom of the page I change the hash # part of the url. When the back button is hit, it shows waiting icon and then loads dynamic content.
Firefox scroll after that exactly to place the page was scrolled (good).
Opera and Safari seem to load exactly the same state there were before, so dynamic content seems to be already prefetched and displayed (good).
But IE and Chrome want to scroll before dynamic content is load and they don't try again later. IE get stucked at the top of the page and Chrome somewhere in the middle (bottom of the page before dynamic content shows up).
Now, what could I do to solve this issue? I could in theory store the current scroll position to url hash when any click is detected. Then previous page is load and I could simply parse the hash and ScrollTop(). But for some reason, this
$(document).live("click", function() { window.alert("gotcha"); });
doesn't work for me anyway.
The document doesn't have anything to be clicked on. document.documentElement is the root <html> node, so attach events to that, or to the window if appropriate.