2

Is there a script to make the browser refresh when a page is re-sized? More specifically, one that emulates the browser refresh button or F5? I've found two, but they don't quite do what I'm looking for;

<script type="text/javascript">
var currheight = document.documentElement.clientHeight;
window.onresize = function(){
    if(currheight != document.documentElement.clientHeight) {
        location.replace(location.href);
    }    
}
</script>

and

<body onResize="window.location=window.location;">

The problem with these two is they appear to completely reset the page where as using the browsers refresh function leaves some user made changes intact (like being at a specific hash for instance) which is what I need.

So is there a way to refresh the window on re-size with a script similar to if the browser refresh was clicked? I don't understand why there is even a difference but there is.

Thanks.

2
  • Why are you doing this? A properly made page layout shouldn't need this. Commented Dec 2, 2009 at 15:59
  • The page uses jquery scrollTo. There are essential two containers side by side that the viewer can "scroll" horizontally between instead of being to separate web pages. The way scrollTo is setup, however, it doesn't allow you to scroll vertically once the page is resized. It does work when the page is first loaded though. I'm trying to find a way to maintain the proper vertical scroll height once the page is resized and I can't think of any other way to do it than this. If you have any suggestions, please share. Commented Dec 2, 2009 at 19:44

3 Answers 3

2

Yes, you probably want to take a look at some JavaScript events. There is an OnResize event.

Here's a link to get you started with events:
http://www.devarticles.com/c/a/JavaScript/OnReset-OnResize-and-Other-JavaScript-Events/

As far as reloading the page, you can do that too:
http://www.mediacollege.com/internet/javascript/page/reload.html

As far as keeping the user values, you could persist them in a session.

Sign up to request clarification or add additional context in comments.

1 Comment

I'm still pretty new to all this... but the best I can figure out from those links only allows me to do what I've already achieved with the scripts in the OP. Thanks for the input though...
2

Here is the perfect solution :

I have included timeout of 1 sec i.e. browser will refresh after 1 sec of window resize

$(window).resize(function() {
    setTimeout( function(){
        window.location.href = window.location.href;
    },1000); 
});

Without timeout

$(window).resize(function() {
    window.location.href = window.location.href;
});

NOTE : You may also use
window.location.reload() instead of window.location.href = window.location.href

window.location.reload() reloads the current page with POST data,
while
window.location.href=window.location.href does not include the POST data

-- hope it helps

Comments

1

Try this:

<![if !IE]> <body onresize="document.location=window.location;"> <![endif]>
<!--[if IE]> <body onresize="window.location.reload();"> <![endif]-->

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.