Chapter 7, The Browser Environment

Lets practice the following exercise:

Exercises

  1. The title clock program is as follows:
            setInterval(function () { 
              document.title = new Date().toTimeString(); 
            }, 1000); 
    
  2. To animate resizing of a 200 x 200 pop up to 400 x 400, use the following code:
            var w = window.open( 
                'http://phpied.com', 'my', 
                 'width = 200, height = 200'); 
     
            var i = setInterval((function () { 
              var size = 200; 
              return function () { 
                size += 5; 
                w.resizeTo(size, size); 
                if (size === 400) { 
                  clearInterval(i); 
                } 
              }; 
            }()), 100); 
    

    Every 100 ms (1/10th of a second) the pop-up size increases by five pixels. You keep a reference to the interval i so you can clear it once done. The variable size tracks the pop-up size (and why not keep it private inside a closure). ...

Get Object-Oriented JavaScript - Third Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.