|
|
Posted by Spartanicus on 11/25/91 11:48
Michael Winter <m.winter@blueyonder.co.uk> wrote:
>> How do I prevent this from executing twice when the window is resized:
>>
>> window.onresize = function () {
>> alert('foo');
>> }
>
>The event is only dispatched to the body element once in Opera, so you
>could add the listener there instead.
>
>As the body property of the document object will initially be null, you
>have three options:
>
> 1. <body onresize="/* ... */">
>
> 2. <body>
> <script type="text/javascript">
> document.body.onresize = function() {
> /* ... */
> };
> </script>
>
> 3. <head>
> <script type="text/javascript">
> this.onload = function() {
> document.body.onresize = function() {
> /* ... */
> };
> };
> </script>
Thanks, I used #3.
In trying to take it one step further I'd like the function to execute
only when the window width changes. First I should illustrate what I'm
trying to do.
Opera has a preliminary implementation of CSS3 media queries, this
allows dissolving a multi column layout for narrower window widths.
Currently the CSS media query isn't reevaluated on a window resize, it
requires a reload, so I'm using JS to do that:
http://homepage.ntlworld.com/spartanicus/css_layout.htm
Ideally I'd like the reload only to occur if the viewport width changes.
After a glance in a JS book and not hindered by a proper understanding
of JS & the DOM I tried:
<script type="text/javascript">
window.innerWidth.onresize = function() {
location.reload(false);
};
</script>
But no go, any idea if this refinement is possible?
--
Spartanicus
Navigation:
[Reply to this message]
|