Thread: Javascript: can't detect onresize event?

  1. #1
    Guest Sebastiani's Avatar
    Join Date
    Aug 2001
    Location
    Waterloo, Texas
    Posts
    5,708

    Javascript: can't detect onresize event?

    Greetings, I've tried a variety of different things, but neither IE nor Firefox seem to trigger an onresize event when the window is, well, resized. Test code:

    Code:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns = "http://www.w3.org/1999/xhtml">
        <!-- ...this doesn't seem to work... -->
        <body onresize = "regenerate( )" >
            <script type = "text/javascript">
            /*
                ...nor this...
            */
                window.onresize = "regenerate( )";
                function regenerate( )
                {
                    alert( "regenerate( )" );
                }
            </script>        
        </body>
    </html>
    Any ideas?

  2. #2
    Jack of many languages Dino's Avatar
    Join Date
    Nov 2007
    Location
    Chappell Hill, Texas
    Posts
    2,332
    I got nothing until I removed the quotes:
    Code:
    window.onresize = regenerate( );
    This causes the alert to fire on page load, but still not on resize in Safari.
    Mainframe assembler programmer by trade. C coder when I can.

  3. #3
    Jack of many languages Dino's Avatar
    Join Date
    Nov 2007
    Location
    Chappell Hill, Texas
    Posts
    2,332
    Here you go:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns = "http://www.w3.org/1999/xhtml">
        <!-- ...this doesn't seem to work... -->
        <head>
        <script type="text/javascript">
        function regenerate(parm )
                {
                    alert( parm );
                    return true ;
                }
                </script> 
        </head>
        <body onresize="regenerate('onresize');" onload="regenerate('onload');">
            <script type = "text/javascript">
    
         
                regenerate('body' );
            </script>        
        </body>
    </html>
    It was the spaces between "onresize = "regenerate()". Go figure.
    Mainframe assembler programmer by trade. C coder when I can.

  4. #4
    Guest Sebastiani's Avatar
    Join Date
    Aug 2001
    Location
    Waterloo, Texas
    Posts
    5,708
    Got it! Removing the quotes was a step in the right direction - then you just need to assign it to the function (without invoking it).

    Code:
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns = "http://www.w3.org/1999/xhtml">
    	<body>
    		<script type = "text/javascript">
    		/*
    			Works like a charm!
    		*/
    			window.onresize = regenerate;
    			function regenerate( )
    			{
    				alert( "regenerate( )" );
    			}
    		</script>		
    	</body>
    </html>

    Thanks for the important clue, Dino.

  5. #5
    Guest Sebastiani's Avatar
    Join Date
    Aug 2001
    Location
    Waterloo, Texas
    Posts
    5,708
    Quote Originally Posted by Dino View Post
    Here you go:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns = "http://www.w3.org/1999/xhtml">
        <!-- ...this doesn't seem to work... -->
        <head>
        <script type="text/javascript">
        function regenerate(parm )
                {
                    alert( parm );
                    return true ;
                }
                </script> 
        </head>
        <body onresize="regenerate('onresize');" onload="regenerate('onload');">
            <script type = "text/javascript">
    
         
                regenerate('body' );
            </script>        
        </body>
    </html>
    It was the spaces between "onresize = "regenerate()". Go figure.
    Ahhh - the spaces! Your right, it works great. Thanks again.

  6. #6
    Ethernal Noob
    Join Date
    Nov 2001
    Posts
    1,901
    you should check out jQuery to do your event binding, makes it a lot more uniform and you can seperate the implementation away from the page itself.

  7. #7
    Deprecated Dae's Avatar
    Join Date
    Oct 2004
    Location
    Canada
    Posts
    1,034
    Seconded on jQuery.

    Quote Originally Posted by Dino View Post
    I got nothing until I removed the quotes:
    Code:
    window.onresize = regenerate( );
    This causes the alert to fire on page load, but still not on resize in Safari.
    It fires there cause you just invoked it right at load time.

    The problem wasn't the whitespace - that makes no sense. The problem was the declaration. You should declare all of your JS in the <head>'er. JS in <head> is parsed onready, JS in <body> is parsed onload. It's weird, but in certain cases you can't use something before it's declared when in <body>. It's best to keep head JS and body JS independent of eachother, or use onready/load correctly. In this case, <body onresize=""> wouldn't work because regenerate was declared in the body. Move it up into the head, and it works. Setting window.onresize to the eval string doesn't seem to work period.

    You're doing it the correct way now, but all you had to do was move the script tag, it would have worked, however incorrect, see:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns = "http://www.w3.org/1999/xhtml">
        <!-- ...this doesn't seem to work... oh wait it does... -->
            <script type = "text/javascript">
            /*
                ...nor this...
            */
                window.onresize = "regenerate( )";
                function regenerate( )
                {
                    alert( "regenerate( )" );
                }
            </script>      
        <body onresize = "regenerate( )" >
      
        </body>
    </html>
    Warning: Have doubt in anything I post.

    GCC 4.5, Boost 1.40, Code::Blocks 8.02, Ubuntu 9.10 010001000110000101100101

  8. #8
    spurious conceit MK27's Avatar
    Join Date
    Jul 2008
    Location
    segmentation fault
    Posts
    8,300
    Quote Originally Posted by Dae View Post
    The problem wasn't the whitespace - that makes no sense. The problem was the declaration. You should declare all of your JS in the <head>'er. JS in <head> is parsed onready, JS in <body> is parsed onload. It's weird, but in certain cases you can't use something before it's declared when in <body>.
    Yo, js is not whitespace sensitive

    As Dae points out, you are doing the equivalent of calling a function before you define it. You don't have to declare everything in the head, but you should declare as much as possible there.

    A problem may arise if you refer to elements which don't exist yet. What I usually do is reference an external script in the head, and then call an initialization function at the bottom of the page (or with onload).

    BTW, if you install the "firebug" plug-in for firefox (it takes about 5 seconds) you can get a lot of debugging info viewing the page, eg, in this case it would say "regenerate( ) is not defined" which would give you a big clue.
    C programming resources:
    GNU C Function and Macro Index -- glibc reference manual
    The C Book -- nice online learner guide
    Current ISO draft standard
    CCAN -- new CPAN like open source library repository
    3 (different) GNU debugger tutorials: #1 -- #2 -- #3
    cpwiki -- our wiki on sourceforge

  9. #9
    Guest Sebastiani's Avatar
    Join Date
    Aug 2001
    Location
    Waterloo, Texas
    Posts
    5,708
    Okay, well thanks for the tips, guys. Cheers!

Popular pages Recent additions subscribe to a feed

Similar Threads

  1. Event driven game engine
    By abachler in forum Game Programming
    Replies: 9
    Last Post: 12-01-2009, 06:03 AM
  2. Poll event loop
    By rogster001 in forum C++ Programming
    Replies: 2
    Last Post: 09-17-2009, 04:28 AM
  3. JavaScript book recommendations
    By neandrake in forum Tech Board
    Replies: 2
    Last Post: 04-05-2009, 12:27 PM
  4. Lame null append cause buffer to crash
    By cmoo in forum C Programming
    Replies: 8
    Last Post: 12-29-2008, 03:27 AM