JavaScript DHTML/Window Browser/Window

Материал из Web эксперт
Версия от 10:28, 26 мая 2010; Admin (обсуждение | вклад) (1 версия)
(разн.) ← Предыдущая | Текущая версия (разн.) | Следующая → (разн.)
Перейти к: навигация, поиск

Содержание

A Main Window Document

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Main Document</TITLE> <SCRIPT LANGUAGE="JavaScript"> function newWindow() { 

   window.open("http://www.wbex.ru","sub","HEIGHT=200,WIDTH=200")

} </SCRIPT> </HEAD> <BODY> </FORM> <INPUT TYPE="button" VALUE="New Window" onClick="newWindow()">
Text incoming from subwindow: <INPUT TYPE="Text" NAME="entry"> <FORM> </BODY> </HTML> 



 </source>


Capturing Click Events in the Window

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Window Event Capture</TITLE> <SCRIPT LANGUAGE="JavaScript1.2"> function flash(e) { 

   if (e.modifiers = Event.CONTROL_MASK && e.target.name.indexOf("button") == 0) {
       document.bgColor = "red";
       setTimeout("document.bgColor = "white"", 500);
   }
   routeEvent(e)

} window.captureEvents(Event.CLICK); window.onclick = flash; </SCRIPT> </HEAD> <BODY BGCOLOR="white"> <FORM NAME="buttons">

Turn window click event capture on or off (Default is "On")

<INPUT NAME="captureOn" TYPE="button" VALUE="Capture On" onClick="window.captureEvents(Event.CLICK)">  <INPUT NAME="captureOff" TYPE="button" VALUE="Capture Off" onClick="window.releaseEvents(Event.CLICK)">

Ctrl+Click on a button to see if clicks are being captured by the window 

(background color will flash red):<P>
  • <INPUT NAME="button1" TYPE="button" VALUE="Informix" onClick="alert("You clicked on Informix.")">
  • <INPUT NAME="button2" TYPE="button" VALUE="Oracle" onClick="alert("You clicked on Oracle.")">
  • <INPUT NAME="button3" TYPE="button" VALUE="Sybase" onClick="alert("You clicked on Sybase.")">

</FORM> </BODY> </HTML> 


 </source>


Checking Before Closing a Window

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>window.closed Property</TITLE> <SCRIPT LANGUAGE="JavaScript"> var newWind; var isIE3 = (navigator.appVersion.indexOf("MSIE 3") != -1) ? true : false; function newWindow() { 

   newWind = window.open("","subwindow","HEIGHT=200,WIDTH=200")
   if (newWind.opener == null) {
       newWind.opener = window
   }
   setTimeout("finishNewWindow()", 100)

} function finishNewWindow() { 

   var output = ""
output += "<HTML><BODY>

A Sub-window

" 
   output += "<FORM><INPUT TYPE="button" VALUE="Close Main Window""
   output +="onClick="window.opener.close()"></FORM></BODY></HTML>"
   newWind.document.write(output)
   newWind.document.close()

}

function closeWindow() { 

   if (isIE3) {
       newWind = window.open("","subwindow","HEIGHT=200,WIDTH=200")    
   }
   if (newWind && !newWind.closed) {
       newWind.close()
   }

} </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" VALUE="Open Window" onClick="newWindow()">
<INPUT TYPE="button" VALUE="Close it if Still Open" onClick="closeWindow()"> </FORM> </BODY> </HTML> 


 </source>


Close window and open document in new window

   <source lang="html4strict">

<html> <head> <title>Javascript examples</title> <script language="javascript">

</script>

</head> <body bgcolor="#ffffff" text="#000000"> This is a new Window

<a href="javascript:CloseWindow()">Close This Window</a>

<a href="javascript:CloseAndNewPage()">Close This Window And Open This Document in Original Window</a> </body> </html> 



 </source>


Communicating with a New Window

   <source lang="html4strict">

<html> <head> <title>Recipe 6.6</title> <script type="text/javascript"> var newWindow; function makeNewWindow() { 

   if (!newWindow || newWindow.closed) {
       newWindow = window.open("","sub","status,height=200,width=300");
       setTimeout("writeToWindow()", 50);
   } else if (newWindow.focus) {
       newWindow.focus();
   }

} function writeToWindow() { 

   var newContent = "<html><head><title>Secondary  Window</title></head>";
newContent += "<body>

This is a script-created window.

"; 
   newContent += "</body></html>";
   newWindow.document.write(newContent);
   newWindow.document.close();

} </script> </head> <body>

Communicating with a New Window

<form> <input type="button" value="Create New Window" onclick="makeNewWindow();" /> </form> </body> </html> 



 </source>


Contents of a Main Window Document That Generates a Second Window

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Master of all Windows</TITLE> <SCRIPT LANGUAGE="JavaScript1.1"> var myWind function doNew() { 

   if (!myWind || myWind.closed) {
       myWind = window.open("http://www.wbex.ru/","subWindow",
          "HEIGHT=200,WIDTH=350,resizable")
   } else {
       // bring existing subwindow to the front
       myWind.focus()
   }

} </SCRIPT> </HEAD> <BODY> <FORM NAME="input"> Select a color for a new window: <INPUT TYPE="radio" NAME="color" VALUE="red" CHECKED>Red <INPUT TYPE="radio" NAME="color" VALUE="yellow">Yellow <INPUT TYPE="radio" NAME="color" VALUE="blue">Blue <INPUT TYPE="button" NAME="storage" VALUE="Make a Window" onClick="doNew()">

This field will be filled from an entry in another window: <INPUT TYPE="text" NAME="entry" SIZE=25> </FORM> </BODY> </HTML> 



 </source>


Creating an always Raised Window

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Simple Signed Script</TITLE> <SCRIPT LANGUAGE="JavaScript"> function newRaisedWindow() { 

   var newWindow = window.open("","","HEIGHT=100,WIDTH=300,alwaysRaised")
   var newContent = "<HTML><BODY>message"
   newContent += "<FORM><INPUT TYPE="button" VALUE="OK""
   newContent += "onClick="self.close()"></FORM></BODY></HTML>"
   newWindow.document.write(newContent)
   newWindow.document.close()

} </SCRIPT> </HEAD> <BODY> This button generates an always-raised new window. <FORM> <INPUT TYPE="button" VALUE="New "Always Raised" Window" onClick="newRaisedWindow()"> </BODY> </HTML> 



 </source>


Creating a New Window

   <source lang="html4strict">

/* JavaScript Bible, Fourth Edition by Danny Goodman John Wiley & Sons CopyRight 2001

  • /

<HTML> <HEAD> <TITLE>New Window</TITLE> <SCRIPT LANGUAGE="JavaScript"> var newWindow function makeNewWindow() { 

   if (!newWindow || newWindow.closed) {
       newWindow = window.open("","","status,height=200,width=300")
       if (!newWindow.opener) {
       newWindow.opener = window
       }
       // force small delay for IE to catch up
       setTimeout("writeToWindow()", 50)
   } else {
       // window"s already open; bring to front
       newWindow.focus()
   }

} function writeToWindow() { 

   // assemble content for new window
   var newContent = "<HTML><HEAD><TITLE>One Sub Window</TITLE></HEAD>"
newContent += "<BODY>

This window is brand new.

" 
   newContent += "</BODY></HTML>"
   // write HTML to new window document
   newWindow.document.write(newContent)
   newWindow.document.close() // close layout stream

} </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" NAME="newOne" VALUE="Create New Window" 

onClick="makeNewWindow()">

</FORM> </BODY> </HTML> 


 </source>


Hyper link to close window

   <source lang="html4strict">

<html> <head> <title>Hyper link to close window</title> <script language="javascript">

</script>

</head> <body bgcolor="#ffffff" text="#000000"> This is a new Window

<a href="javascript:CloseWindow()">Close This Window</a> </body> </html> 



 </source>


Make a new window

   <source lang="html4strict">

<html> <head> <title>A New Window</title> <script language="JavaScript" type="text/javascript"> var newWindow; function makeNewWindow() { 

   if (!newWindow || newWindow.closed) {
       newWindow = window.open("","sub","status,height=200,width=300");
       if (!newWindow.opener) {
           newWindow.opener = window;
       }
       setTimeout("writeToWindow()", 500);
   } else if (newWindow.focus) {
       newWindow.focus();
   }

} function writeToWindow() { 

   var newContent = "<html><head><title>Sub Window</title></head>";
newContent += "<body>

This is a new window.

"; 
   newContent += "</body></html>";
   newWindow.document.write(newContent);
   newWindow.document.close(); // close layout stream

} </script> </head> <body> <form> <input type="button" value="Create New Window" 

onclick="makeNewWindow();">

</form> </body> </html> 



 </source>


Maximize Window for different browser

   <source lang="html4strict">

function maximizeWindow() { 

   var offset = (navigator.userAgent.indexOf("Mac") != -1 || 
                 navigator.userAgent.indexOf("Gecko") != -1 || 
                 navigator.appName.indexOf("Netscape") != -1) ? 0 : 4;
   window.moveTo(-offset, -offset);
   window.resizeTo(screen.availWidth + (2 * offset), screen.availHeight + (2 * offset));

} 



 </source>


Move a window

   <source lang="html4strict">

<HTML> <BODY>

Welcome to the New Window!

<FORM name="myform"> <INPUT TYPE="button" value="Move Window" onClick="window.moveBy(10,10);"> <P> <INPUT TYPE="button" value="Set a Position" onClick="window.moveTo(240,200);"> <P> <INPUT TYPE="button" value="Close Window" onClick="window.close();"> </FORM> </BODY> </HTML> 


 </source>


New Window Laboratory

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>window.open() Options</TITLE> <SCRIPT LANGUAGE="JavaScript"> function makeNewWind(form) { 

   var attr = "HEIGHT=300,WIDTH=300"
   for (var i = 0; i < form.elements.length; i++) {
       if (form.elements[i].type == "checkbox") {
           attr += "," + form.elements[i].name + "=" 
           attr += (form.elements[i].checked) ? "yes" : "no"
       }
   }
   var newWind = window.open("http://www.wbex.ru","subwindow",attr)

} </SCRIPT> </HEAD> <BODY> <FORM> Select new window options:

All Browsers Features:
<INPUT TYPE="checkbox" NAME="toolbar">toolbar <INPUT TYPE="checkbox" NAME="location">location
<INPUT TYPE="checkbox" NAME="directories">directories <INPUT TYPE="checkbox" NAME="status">status
<INPUT TYPE="checkbox" NAME="menubar">menubar <INPUT TYPE="checkbox" NAME="scrollbars">scrollbars
<INPUT TYPE="checkbox" NAME="resizable">resizable <INPUT TYPE="checkbox" NAME="copyhistory">copyhistory
<INPUT TYPE="button" NAME="forAll" VALUE="Make New Window" onClick="makeNewWind(this.form)">


</FORM> </BODY> </HTML> 



 </source>


Open a new link from a button

   <source lang="html4strict">

<html> <head> <script type="text/javascript"> function open_win() { 

   window.open("http://www.wbex.ru")

} </script> </head> <body> <form> <input type=button value="Open Window" onclick="open_win()"> </form> </body> </html> 



 </source>


Open a new window and control its appearance

   <source lang="html4strict">

<html> <head> <script type="text/javascript"> function open_win(){ 

   window.open("http://www.wbex","_blank",
               "toolbar=yes, location=no, directories=no, 
                       status=no, menubar=no, scrollbars=yes, 
                       resizable=yes, copyhistory=yes, width=600, height=600")

} </script> </head> <body> <form> <input type="button" value="Open Window" onclick="open_win()"> </form> </body> </html> 



 </source>


Open a new window setting height, width and position

   <source lang="html4strict">

<HTML> <HEAD> <SCRIPT language="JavaScript">

</SCRIPT> </HEAD> <BODY> <FORM name="myform"> <INPUT TYPE="button" value="Open New Window" onClick="new_win()"> </FORM> </BODY> </HTML> 


 </source>


Open a window and center it

   <source lang="html4strict">

var myWindow; function openCenteredWindow(url) { 

   var width = 400;
   var height = 300;
   var left = parseInt((screen.availWidth/2) - (width/2));
   var top = parseInt((screen.availHeight/2) - (height/2));
   var windowFeatures = "width=" + width + ",height=" + height + ",status,resizable,left=" + left + ",top=" + top + "screenX=" + left + ",screenY=" + top;
   myWindow = window.open(url, "subWind", windowFeatures);

} 



 </source>


Opening and Closing Windows

   <source lang="html4strict">

/* JavaScript Unleashed, Third Edition by Richard Wagner and R. Allen Wyke ISBN: 067231763X Publisher Sams CopyRight 2000

  • /

<html> <head> <title>Window Open</title> <SCRIPT LANGUAGE="JavaScript"> </SCRIPT> </head>

<body >

Window Open Example

<p>Please select the following display options and then click the Open Window button. </i></p> <form name="winOptions" method="POST"> <p>Would you like an existing page or one created on the fly?</p> <input 

    type=radio
    checked
    name="pageType"
    value="existing">Existing Page
    <input
         type=text
         size=30
         maxlength=256
         name="urlBox"></p>
    <input
         type=radio
         name="pageType"
         value="dynamic">Dynamic Page</p>

<p>Window Attributes:</p> 

<input
     type=checkbox
     name="toolbarOption"
     value="ON"
     >Toolbar    <input
     type=checkbox
     name="menubarOption"
     value="ON">Menubar    <input
     type=checkbox
     name="scrollbarsOption"     value="ON">Scrollbars   <input
     type=checkbox
     name="resizableOption"
     value="ON">Resizable
<input
     type=checkbox
     name="statusOption"
     value="ON">Status     <input
     type=checkbox
     name="locationOption"
     value="ON">Location   <input
     type=checkbox name="directoriesOption"
     value="ON">Directories  <input
     type=checkbox name="copyHistoryOption"
     value="ON">Copy History
<input
     type=checkbox
     name="customSizeOption"
     value="ON">Custom Size
Width: <input
     type=text
     size=5
     maxlength=5
     name="widthBox">  Height: <input
     type=text
     size=5
     maxlength=5
     name="heightBox">               <input
     type="button"
     name="OpenButton"
     value="Open Window"
     onClick="openWindow()">  <input
     type="button"
     name="CloseButton"
     value="Close Window"
     onClick="closeWindow()">

</form> <p> </p> </body> </html> 


 </source>


Opening a New Window

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Party</TITLE> <SCRIPT LANGUAGE="JavaScript"></SCRIPT> </HEAD> <BODY>

New Years Eve Party!

<P>When: December 31, 2007 8pm</P> <P>Where: 613 Way #504</P> <P>Dress: Casual </P> <FORM> <INPUT TYPE="BUTTON" VALUE="Click for directions" 

ONCLICK="directions()">

</FORM> <P>by December 28th. <A HREF="mailto:info@wbex.ru">

<I>info@wbex.ru</A>

</BODY> </HTML> 


 </source>


Open multiple windows at one click

   <source lang="html4strict">

<html> <head> <script type="text/javascript"> function open_win() { 

   window.open("http://www.wbex.ru/")
   window.open("http://www.wbex.ru/")

} </script> </head> <body> <form> <input type=button value="Open Windows" onclick="open_win()"> </form> </body> </html> 



 </source>


Popup window animation (fly across screen)

   <source lang="html4strict">

/* Examples From JavaScript: The Definitive Guide, Fourth Edition Legal matters: these files were created by David Flanagan, and are Copyright (c) 2001 by David Flanagan. You may use, study, modify, and distribute them for any purpose. Please note that these examples are provided "as-is" and come with no warranty of any kind. David Flanagan

  • /

<html> <script> // Here are the initial values for our animation. var x = 0, y = 0, w=200, h=200; // Window position and size var dx = 5, dy = 5; // Window velocity var interval = 100; // Milliseconds between updates // Create the window that we"re going to move around. // The javascript: URL is simply a way to display a short document. // The final argument specifies the window size.

var win = window.open("javascript:"

BOUNCE!

"", "", 
         "width=" + w + ",height=" + h);

// Set the initial position of the window. win.moveTo(x,y); // Use setInterval() to call the bounce() method every interval // milliseconds. Store the return value so that we can stop the // animation by passing it to clearInterval(). var intervalID = window.setInterval("bounce()", interval); // This function moves the window by (dx, dy) every interval ms. // It bounces whenever the window reaches the edge of the screen. function bounce() { 

   // If the user closed the window, stop the animation.
   if (win.closed) {
       clearInterval(intervalID);
       return;
   }
   // Bounce if we have reached the right or left edge.
   if ((x+dx > (screen.availWidth - w)) || (x+dx < 0)) dx = -dx;
   // Bounce if we have reached the bottom or top edge.
   if ((y+dy > (screen.availHeight - h)) || (y+dy < 0)) dy = -dy;
   // Update the current position of the window.
   x += dx;
   y += dy;
   // Finally, move the window to the new position.
   win.moveTo(x,y);

} </script>

<form> <input type="button" value="Stop" 

      onclick="clearInterval(intervalID); win.close();">

</form> </html> 


 </source>


Preventing a Page from Scrolling

   <source lang="html4strict">

<html> <head> <title>onscroll Event Handler</title> <script type="text/javascript"> window.onscroll = zipBack; function zipBack() {

window.scroll(0,0); } </script>

</head> <body>

onscroll Event Handler

This page always zips back to the top if you try to scroll it.

<iframe frameborder="0" scrolling="no" height="1000" src="bofright.htm"></iframe>

</body> </html> 


 </source>


Properties and Methods of the Window Object

   <source lang="html4strict">

/* JavaScript Unleashed, Third Edition by Richard Wagner and R. Allen Wyke ISBN: 067231763X Publisher Sams CopyRight 2000

+------------+----------------+------------------------------------------+ Type Item Description +------------+----------------+------------------------------------------+ Method atob() Decodes a string that has been encoded using base 

                               64 encoding. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              alert()          Displays an alert dialog box with the text string 
                               passed.

+------------+----------------+------------------------------------------+ 

              back()           Loads the previous page in place of the window 
                               instance. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              blur()           Removes the focus from a window.

+------------+----------------+------------------------------------------+ 

              btob()           Encodes a string with base 64 encoding. 
                               This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             captureEvents()   Sets the window to capture all events of a specified 
                               type. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             clearInterval()   Clears the interval set with the setInterval() 
                               method. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             clearTimeout()    Clears the timeout set with the setTimeout() method.

+------------+----------------+------------------------------------------+ 

             close()           Closes the instance of the window. This method was 
                               added in JavaScript 1.1.

+------------+----------------+------------------------------------------+ 

             confirm()          Displays a confirmation dialog box.

+------------+----------------+------------------------------------------+ 

             crypto.random()    Generates a random string of data whose length is 
                                specified by the number of bytes passed. This method 
                                was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            crypto.signText()   Returns a string of encoded data that represents a 
                                signed object. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            disableExternalCapture()   Disables external event capturing. 
                                       from JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            enableExternalCapture()    Enables external event capturing for the 
                                       pages loaded from other servers. This method 
                                       was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            find()               Displays a Find dialog box in which the user can 
                                 enter text to search the current page. This method 
                                 was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            focus()              Assigns the focus to the specified window instance. 
                                 This method was added in JavaScript 1.1.

+------------+----------------+------------------------------------------+ 

             forward()           Loads the next page in place of the window instance. 
                                 This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             handleEvent()       Invokes the handler for the event passed. 
                                 This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             home()              Loads the user"s specified home page in place of 
                                 the window instance. 
                                 This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             moveBy()            Moves the window by the specified amount. 
                                 This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             moveTo()            Moves the window to the specified location. 
                                 This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             open()              Opens a new instance of a window.

+------------+----------------+------------------------------------------+ 

             print()             Invokes the Print dialog box so the user can 
                                 print the current window. This method was added in 
                                 JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             prompt()           Displays a prompt dialog box.

+------------+----------------+------------------------------------------+ 

             releaseEvents()    Releases the captured events of a specified type. 
                                This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             resizeBy()         Resizes the window by the specified amount. 
                                This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              resizeTo()        Resizes the window to the specified size. 
                                This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              routeEvent()      Passes the events of a specified type to be 
                                handled natively. 
                                This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              scroll()          Scrolls the document in the window to a specified 
                                location. This method was added in JavaScript 1.1.

+------------+----------------+------------------------------------------+ 

              scrollBy()        Scrolls the document in the window by a specified 
                                amount. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              scrollTo()        Scrolls the document"s width and height to a 
                                specified location in the window. This method was 
                                added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              setHotKeys()      Allows you to toggle on or off the window hotkeys 
                                when no menus are present. 
                                This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             setInterval()      Invokes a function or evaluates an expression 
                                every time the number of milliseconds has passed. 
                                This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             setResizable()     Allows you to specify whether a user can resize a 
                                window. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             setTimeout()       Invokes a function or evaluates an expression when 
                                the number of milliseconds has passed.

+------------+----------------+------------------------------------------+ 

             setZOptions()      Allows you to specify the z-order stacking of a 
                                window. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             stop()             Stops the current window from loading another item 
                                within it. This method was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ Property +------------+----------------+------------------------------------------+ 

             closed            Specifies if the window instance has been closed.

+------------+----------------+------------------------------------------+ 

             crypto            Allows access to Navigator"s encryption features. 
                               This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             defaultStatus     Specifies the default message in the window"s 
                               status bar.

+------------+----------------+------------------------------------------+ 

             document          References all the information about the document 
                               within this window. See the Document object for 
                               more information.

+------------+----------------+------------------------------------------+ 

             frames            References all the information about the frames 
                               within this window. See the Frame object for 
                               more information.

+------------+----------------+------------------------------------------+ 

             history           References the URLs the user has visited. 
                               This property was added in JavaScript 1.1.

+------------+----------------+------------------------------------------+ 

             innerHeight       Contains the height in pixels of the display 
                               area of the current window. This property was 
                               added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             innerWidth        Contains the width in pixels of the display area 
                               of the current window. This property was added in 
                               JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             length            Represents the number of frames in the current window.

+------------+----------------+------------------------------------------+ 

             location          Contains the current URL loaded into the window.

+------------+----------------+------------------------------------------+ 

             locationbar       Refers to the browser"s location bar. 
                               This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

          locationbar.visible  Contains Boolean value that tells you if the 
                               location bar on the user"s browser is visible. 
                               This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             menubar            Refers to the browser"s menu bar. This property was 
                                added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             menubar.visible    Contains Boolean value that tells you if the menu 
                                bar on the user"s browser is visible . 
                                This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              name              Contains the name of the window.

+------------+----------------+------------------------------------------+ 

           offscreenBuffering   Contains a Boolean value that allows you to determine 
                                if any window updates are performed in an off screen 
                                buffer. This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             opener             Contains the name of the window from which a second 
                                window was opened.

+------------+----------------+------------------------------------------+ 

             outerHeight        Contains the height in pixels of the outer area of 
                                the current window. This property was added in 
                                JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             outerWidth         Contains the width in pixels of the outer area of 
                                the current window. This property was added in 
                                JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             pageXOffset        Contains the x-coordinate of the current window. 
                                This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             pageYOffset        Contains the y-coordinate of the current window. 
                                This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             parent             Refers to the uppermost window that is displaying 
                                the current frame.

+------------+----------------+------------------------------------------+ 

             personalbar        Reference to the browser"s personal bar. 
                                This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

        personalbar.visible     Contains Boolean value that tells you if the 
                                personal bar on the user"s browser is visible.
                                 This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             screenX            Refers to the browser"s x-coordinate at the left 
                                edge of the window. This property was added in 
                                JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

             screenY            Refers to the browser"s y-coordinate at the top 
                                edge of the window. This property was added in 
                                JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              scrollbars        Refers to the browser"s scrollbars. This property 
                                was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

           scrollbars.visible   Contains Boolean value that tells you if the 
                                scrollbars on the user"s browser are visible . 
                                This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

               self              Refers to the current window.

+------------+----------------+------------------------------------------+ 

             status              Refers to the message in the window"s status bar.

+------------+----------------+------------------------------------------+ 

             statusbar           Refers to the browser"s status bar. This property 
                                 was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

           statusbar.visible     Contains Boolean value that tells you if the 
                                 status bar on the user"s browser is visible . 
                                 This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            toolbar              Refers to the browser"s toolbar. This property was 
                                 added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

            toolbar.visible      Contains Boolean value that tells you if the 
                                 toolbar on the user"s browser is visible . 
                                 This property was added in JavaScript 1.2.

+------------+----------------+------------------------------------------+ 

              top                Refers to the uppermost window that is displaying 
                                 the current frame.

+------------+----------------+------------------------------------------+ 

              window             Refers to the current window.

+------------+----------------+------------------------------------------+

  • /


 </source>


References to Window Objects

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Window Opener and Closer</TITLE> <SCRIPT LANGUAGE="JavaScript"> var newWindow; function makeNewWindow() { 

   newWindow = window.open("","","HEIGHT=300,WIDTH=300")

} function closeNewWindow() { 

   if (newWindow) {
       newWindow.close()
       newWindow = null
   }

} </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE="button" VALUE="Create New Window" onClick="makeNewWindow()"> <INPUT TYPE="button" VALUE="Close New Window" onClick="closeNewWindow()"> </FORM> </BODY> </HTML> 



 </source>


Resize a window

   <source lang="html4strict">

<html> <head> <script type="text/javascript"> function resizeWindow(){ 

   window.resizeBy(-100,-100)

} </script> </head> <body> <form> <input type="button" onclick="resizeWindow()" value="Resize window"> </form> </body> </html> 



 </source>


Resize a window to a specified size

   <source lang="html4strict">

<html> <head> <script type="text/javascript"> function resizeWindow(){ 

   window.resizeTo(500,300)

} </script> </head> <body> <form> <input type="button" onclick="resizeWindow()" value="Resize window"> </form> </body> </html> 



 </source>


Scroll the window

   <source lang="html4strict">

<html> <head> <script type="text/javascript"> function scrollWindow(){ 

   window.scrollBy(50,50)

} </script> </head> <body> <form> <input type="button" onclick="scrollWindow()" value="Scroll"> </form>

















1

















2

















3

















4

















5

















6











































































































7 </body> </html> 



 </source>


Scroll Window

   <source lang="html4strict">

function scrollWindow() { 

   window.scrollBy(0, 1);

} function initScroll() { 

   setInterval("scrollWindow()", 100);

} 


 </source>


Setting Window Height and Width(Firefox)

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Window Sizer</TITLE> <SCRIPT LANGUAGE="JavaScript"> var originalWidth = window.outerWidth var originalHeight = window.outerHeight function setInner(width, height) { 

   window.innerWidth = width
   window.innerHeight = height

} function setOuter(width, height) { 

   window.outerWidth = width
   window.outerHeight = height

} function restore() { 

   window.outerWidth = originalWidth
   window.outerHeight = originalHeight

} </SCRIPT> </HEAD> <BODY> <FORM> Setting Inner Sizes
<INPUT TYPE="button" VALUE="600 Pixels Square" onClick="setInner(600,600)">
<INPUT TYPE="button" VALUE="300 Pixels Square" onClick="setInner(300,300)">
<INPUT TYPE="button" VALUE="Available Screen Space" 

onClick="setInner(screen.availWidth, screen.availHeight)">

Setting Outer Sizes
<INPUT TYPE="button" VALUE="600 Pixels Square" onClick="setOuter(600,600)">
<INPUT TYPE="button" VALUE="300 Pixels Square" onClick="setOuter(300,300)">
<INPUT TYPE="button" VALUE="Available Screen Space" 

onClick="setOuter(screen.availWidth, screen.availHeight)">

<INPUT TYPE="button" VALUE="Cinch up for Win95" onClick="setInner(273,304)">
<INPUT TYPE="button" VALUE="Cinch up for Mac" onClick="setInner(273,304)">
<INPUT TYPE="button" VALUE="Restore Original" onClick="restore()">
</FORM> </BODY> </HTML> 



 </source>


Simple Notification: Display Window Info

   <source lang="html4strict">

<HTML> <HEAD NAME = "WindowPane"> <SCRIPT LANGUAGE = "JavaScript"> 

    function displayWindowInfo() {
       var winInfo = ""
       winInfo = "Number of frames: " + window.length + "\r"
       winInfo += "Window object name: " + window.window + "\r"
       winInfo += "Window parent name: " + window.parent + "\r"
       winInfo += "URL: " + window.location + "\r"
       alert(winInfo)
     }

</SCRIPT> </HEAD>

<BODY> <FORM> <INPUT 

     Type="button"
     Value="Display Window Information"
     OnClick="displayWindowInfo()"

</INPUT> </FORM> </BODY> 


 </source>


To hide JavaScript errors from the user

   <source lang="html4strict">

$(window).error(function(){ 

 return true;

}); 


 </source>


Using document.write() on Another Window

   <source lang="html4strict">

<html> <head> <title>Writing to Subwindow</title> <script type="text/javascript"> var newWindow; function makeNewWindow() { 

   newWindow = window.open("","","status,height=200,width=300");

} function subWrite() { 

   if (newWindow.closed) { 
       makeNewWindow(); 
   } 
   newWindow.focus(); 
   var newContent = "<html><head><title>title</title></head>";
newContent += "<body bgcolor="coral">

This document is brand new.

"; 
   newContent += "</body></html>"; 
   newWindow.document.write(newContent); 
   newWindow.document.close();

} </script> </head> <body onload="makeNewWindow()"> <form> <input type="button" value="Write to Subwindow" onclick="subWrite()"> </form> </body> </html> 


 </source>


Using document.write() on the Current Window

   <source lang="html4strict">

<html> <head> <title>Writing to Same Doc</title> <script type="text/javascript"> function reWrite() { 

   var newContent = "<html><head><title>title</title></head>";
newContent += "<body bgcolor="aqua">

This document is brand new.

"; 
   newContent += "Click the Back button to see original document."; 
   newContent += "</body></html>"; 
   
   document.write(newContent); 
   document.close();

} </script> </head> <body> <form> <input type="button" value="Replace Content" onclick="reWrite()"> </form> </body> </html> 


 </source>


Using the window.close() Method to Close a Browser Window

   <source lang="html4strict">

<HTML> <BODY>

I"m not even fully opened yet! <SCRIPT> if (window.confirm("Do you want to close the browser?")) window.close(); </SCRIPT>

</BODY> </HTML> 


 </source>


Window focus and blur()

   <source lang="html4strict">

/* JavaScript Bible, Fourth Edition by Danny Goodman John Wiley & Sons CopyRight 2001

  • /

<HTML> <HEAD> <TITLE>Window Focus() and Blur()</TITLE> <SCRIPT LANGUAGE="JavaScript1.1"> // declare global variable name var newWindow = null function makeNewWindow() { 

   // check if window already exists
   if (!newWindow || newWindow.closed) {
       // store new window object in global variable
       newWindow = window.open("","","width=250,height=250")
       // pause briefly to let IE3 window finish opening
       setTimeout("fillWindow()",100)
   } else {
       // window already exists, so bring it forward
       newWindow.focus()
   }

} // assemble new content and write to subwindow function fillWindow() { 

   var newContent = "<HTML><HEAD><TITLE>Another Subwindow</TITLE></HEAD>"
   newContent += "<BODY bgColor="salmon">"
newContent += "

A Salmon-Colored Subwindow.

" 
   newContent += "<FORM><INPUT TYPE="button" VALUE="Bring Main to Front" onClick="self.opener.focus()">"
   // the following button doesn"t work in NN6
   newContent += "<FORM><INPUT TYPE="button" VALUE="Put Me in Back" onClick="self.blur()">"
   newContent += "</FORM></BODY></HTML>"
   // write HTML to new window document

newWindow.document.write(newContent) 

   newWindow.document.close()

} </SCRIPT> </HEAD> <BODY>

Window focus() and blur() Methods

<FORM> <INPUT TYPE="button" NAME="newOne" VALUE="Show New Window" onClick="makeNewWindow()"> </FORM> </BODY> </HTML> 


 </source>


Window Property Picker

   <source lang="html4strict">

/* JavaScript Bible, Fourth Edition by Danny Goodman Publisher: John Wiley & Sons CopyRight 2001 ISBN: 0764533428

  • /

<HTML> <HEAD> <TITLE>Property Picker</TITLE> <SCRIPT LANGUAGE="JavaScript"> var isNav4 = (navigator.appName == "Netscape" && navigator.appVersion.charAt(0) 

>= 4) ? true : false

function fillLeftFrame() { 

   newURL = prompt("Enter the URL of a document to show in the left frame:","")
   if (newURL != null && newURL != "") {
   parent.frames[0].location = newURL
   }

} function showLocationData(form) { 

   for (var i = 0; i <3; i++) {
       if (form.whichFrame[i].checked) {
           var windName = form.whichFrame[i].value
           break
       }
   }
   var theWind = "" + windName + ".location"
   if (isNav4) {
     netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead")
   }
   var theObj = eval(theWind)
   form.windName.value = windName
   form.windHash.value = theObj.hash
   form.windHost.value = theObj.host
   form.windHostname.value = theObj.hostname
   form.windHref.value = theObj.href
   form.windPath.value = theObj.pathname
   form.windPort.value = theObj.port
   form.windProtocol.value = theObj.protocol
   form.windSearch.value = theObj.search
   if (isNav4) {
     netscape.security.PrivilegeManager.disablePrivilege("UniversalBrowserRead")
   }

} </SCRIPT> </HEAD> <BODY> Click the "Open URL" button to enter the location of an HTML document to display 

in the left frame of this window.

<FORM> <INPUT TYPE="button" NAME="opener" VALUE="Open URL..." onClick="fillLeftFrame()">

Select a window/frame. Then click the "Show Location Properties" button to view

each window.location property value for the desired window.

<INPUT TYPE="radio" NAME="whichFrame" VALUE="parent" CHECKED>Parent window <INPUT TYPE="radio" NAME="whichFrame" VALUE="parent.frames[0]">Left frame <INPUT TYPE="radio" NAME="whichFrame" VALUE="parent.frames[1]">This frame <P> <INPUT TYPE="button" NAME="getProperties" VALUE="Show Location Properties" onClick="showLocationData(this.form)"> <INPUT TYPE="reset" VALUE="Clear"><P>

Window:<INPUT TYPE="text" NAME="windName" SIZE=30>
hash: <INPUT TYPE="text" NAME="windHash" SIZE=30>
host: <INPUT TYPE="text" NAME="windHost" SIZE=30>
hostname: <INPUT TYPE="text" NAME="windHostname" SIZE=30>
href: <TEXTAREA NAME="windHref" ROWS=3 COLS=30 WRAP="soft"> </TEXTAREA>
pathname: <TEXTAREA NAME="windPath" ROWS=3 COLS=30 WRAP="soft"> </TEXTAREA>
port: <INPUT TYPE="text" NAME="windPort" SIZE=30>
protocol: <INPUT TYPE="text" NAME="windProtocol" SIZE=30>
search: <TEXTAREA NAME="windSearch" ROWS=3 COLS=30 WRAP="soft"> </TEXTAREA>

</CENTER> </FORM> </BODY> </HTML> 


 </source>


Window Resize Methods

   <source lang="html4strict">

/* JavaScript Bible, Fourth Edition by Danny Goodman John Wiley & Sons CopyRight 2001

  • /

<HTML> <HEAD> <TITLE>Window Resize Methods</TITLE> <SCRIPT LANGUAGE="JavaScript"> function doResizeBy(form) { 

   var x = parseInt(form.resizeByX.value)
   var y = parseInt(form.resizeByY.value)
   var count = parseInt(form.count.value)
   for (var i = 0; i < count; i++) {
       window.resizeBy(x, y)
   }

} function doResizeTo(form) { 

   var x = parseInt(form.resizeToX.value)
   var y = parseInt(form.resizeToY.value)
   window.resizeTo(x, y)

} </SCRIPT> </HEAD> <BODY> <FORM> Enter the x and y increment, plus how many times the window should be resized 

by these increments:

Horiz:<INPUT TYPE="text" NAME="resizeByX" SIZE=4> Vert:<INPUT TYPE="text" NAME="resizeByY" SIZE=4> How Many:<INPUT TYPE="text" NAME="count" SIZE=4> <INPUT TYPE="button" NAME="ResizeBy" VALUE="Show resizeBy()" 

onClick="doResizeBy(this.form)">

Enter the desired width and height of the current window:
Width:<INPUT TYPE="text" NAME="resizeToX" SIZE=4> Height:<INPUT TYPE="text" NAME="resizeToY" SIZE=4> <INPUT TYPE="button" NAME="ResizeTo" VALUE="Show resizeTo()" 

onClick="doResizeTo(this.form)">

</FORM> </BODY> </HTML> 



 </source>


Window Resize, motion, maximize

   <source lang="html4strict">

/* JavaScript Bible, Fourth Edition by Danny Goodman John Wiley & Sons CopyRight 2001

  • /

<HTML> <HEAD> <TITLE>Window Gymnastics</TITLE> <SCRIPT LANGUAGE="JavaScript1.2"> var isNav4 = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) >= 4)) // wait in onLoad for page to load and settle in IE function init() { 

   // fill missing IE properties
   if (!window.outerWidth) {
       window.outerWidth = document.body.clientWidth
       window.outerHeight = document.body.clientHeight + 30
   }
   // fill missing IE4 properties
   if (!screen.availWidth) {
       screen.availWidth = 640
       screen.availHeight = 480
   }

} // function to run when window captures a click event function moveOffScreen() { 

   // branch for NN security
   if (isNav4) {
       netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite")
   }
   var maxX = screen.width
   var maxY = screen.height
   window.moveTo(maxX+1, maxY+1)
   setTimeout("window.moveTo(0,0)",500)
   if (isNav4) {
       netscape.security.PrivilegeManager.disablePrivilege("UniversalBrowserWrite")
   }

} // moves window in a circular motion function revolve() { 

   var winX = (screen.availWidth - window.outerWidth) / 2
   var winY = 50
   window.resizeTo(400,300)
   window.moveTo(winX, winY)
   
   for (var i = 1; i < 36; i++) {
       winX += Math.cos(i * (Math.PI/18)) * 5
       winY += Math.sin(i * (Math.PI/18)) * 5
       window.moveTo(winX, winY)
   }

} // moves window in a horizontal zig-zag pattern function zigzag() { 

   window.resizeTo(400,300)
   window.moveTo(0,80)
   var incrementX = 2
   var incrementY = 2
   var floor = screen.availHeight - window.outerHeight
   var rightEdge = screen.availWidth - window.outerWidth
   for (var i = 0; i < rightEdge; i += 2) {
       window.moveBy(incrementX, incrementY)
       if (i%60 == 0) {
           incrementY = -incrementY
       }
   }

} // resizes window to occupy all available screen real estate function maximize() { 

   window.moveTo(0,0)
   window.resizeTo(screen.availWidth, screen.availHeight)

} </SCRIPT> </HEAD> <BODY onLoad="init()"> <FORM NAME="buttons"> Window Gymnastics<P>

  • <INPUT NAME="offscreen" TYPE="button" VALUE="Disappear a Second" onClick="moveOffScreen()">
  • <INPUT NAME="circles" TYPE="button" VALUE="Circular Motion" onClick="revolve()">
  • <INPUT NAME="bouncer" TYPE="button" VALUE="Zig Zag" onClick="zigzag()">
  • <INPUT NAME="expander" TYPE="button" VALUE="Maximize" onClick="maximize()">

</FORM> </BODY> </HTML>


</source>

Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/Window_Browser/Window&oldid=3975»