JavaScript DHTML/Javascript Objects/window

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

Add Desktop Component

 
    
<html>
<head>
<script language="JavaScript">
    function function1() {
        window.external.AddDesktopComponent("http://www.wbex.ru/style/logo.png",
                                            "image", 150, 150, 95, 95);
    }
</script>
</head>
<body>
<button onclick="function1();">Click here to add the new active desktop component
</button>
</body>
</html>



Clear Interval

 
    
<html>
<body>
<script language="javascript">
    var intInterval = 0
    function myInterval(){
        alert("Hello");
    }
</script>
<button onclick="intInterval=window.setInterval("myInterval()", 1000);">
Start interval
</button>
<button onclick="intInterval=window.clearInterval(intInterval);">
Stop interval
</button>
</body>
</html>



Clear Timeout

 
    
<html>
<body>
<script language="javascript">
    var intValue = 0
    function myMethod(){
        alert("Hello");
    }
</script>
<button onclick="intValue=window.setTimeout("myMethod()", 1000);">Start timeout</button>
<button onclick="intValue=window.clearTimeout(intValue);">Stop timeout</button>
</body>
</html>



Close a window

 
    
<html>
<body>
<button onclick="window.close();">Close window</button>
</body>
</html>



Create a Popup window

 
    
<html>
<body>
<script language="JavaScript">
    var popup = window.createPopup();
    popup.document.body.innerHTML = "This will navigate to another site!";
    popup.document.body.style.backgroundColor = "yellow";
</script>
<input type="button" 
       onClick="location.href="http://www.wbex.ru";" 
       onmouseover="popup.show(100, 100, 200, 100, document.body);" 
       onmouseout="popup.hide();" 
       value="Navigate to Another Site">
</body>
</html>



Create a prompt

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    window.prompt("Please, enter your full name", "Yes, here"); 
} 
</script>
<input type="button" value="Open a prompt window" onclick="function1();">
</body>
</html>



Define dialog arguments

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    var myArguments = new Object();
    myArguments.param1 = document.all.myColor.value;
    window.showModalDialog("http://www.wbex.ru", myArguments, ""); 
} 
</script>
<select id="myColor">
<option value="red">Red</option>
<option value="green">Green</option>
<option value="blue">Blue</option>
<option value="yellow">Yellow</option>
</select>
<button onclick="function1();">Open Window</button>
</body>
</html>



Display an alert dialog

 
    
<html>
<body>
<input type="button" onClick="alert("This is an alert window");" value="Click me">
</body>
</html>



Display confirm dialog

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.confirm("Confirmation window");
    }
</script>
<input type="button" value="Click to bring up a confirm window" onclick="function1();">
</body>
</html>



Display information in status (window.status)

 
    
<html>
<head>
<script language="JavaScript">
    function function1() {
        window.status = "Welcome to www.wbex.ru";
    }
</script>
</head>
<body>
    <p onmouseover="function1();" style="cursor:hand">
    Check the status bar message.</p>
</body>
</html>



Execute Javascript

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    var m = window.execScript("alert("test");", "JavaScript");
    alert("The method returns always "+"""+m+"""); 
} 
</script>
<input type="button" value="Click to execute the script" onclick="function1();">
</body>
</html>



Handling Status Message Changes

   
<html> 
<head> 
<title>Generalizable window.status Property</title> 
<script type="text/javascript"> 
function showStatus(msg) { 
    window.status = msg; 
    return true; 
} 
</script> 

</head> 
<body> 
<a href="http://www.example.ru" 
   onmouseover="return showStatus("Go to my Home page.")" 
   onmouseout="return showStatus("")">Home</a> 
<p><a href="http://mozilla.org" 
      onmouseover="return showStatus("Visit Mozilla Home page.")" 
      onmouseout="return showStatus("")">Mozilla</a></p> 
</body> 
</html>



Hide a window

 
    
<html>
<body>
<script language="JavaScript">
var myPopup
function function1() {
    myPopup = window.createPopup();
    myPopup.document.body.style.backgroundColor = "yellow";
    myPopup.show(100,100,100,200,document.body); 
} 
</script>
<input type="button" value="Show popup window" onclick="function1();">
<input type="button" value="Hide popup window" onclick="myPopup.hide();">
</body>
</html>



Is window closed

 
    
<html>
<body>
<button onclick="alert(window.closed);">closed Property Value</button>
</body>
</html>



Is window Open

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    var m = window.createPopup();
    var n = m.document.body;
    n.style.border="solid 2px black";
    n.innerHTML = "<font face="verdana">This is the pop-up window content</font>";
    m.show(350, 270, 200, 50, document.body);
    if (m.isOpen == true) {
        setTimeout("function2()", 2000);
    } 
} 
function function2() {
    alert("The pop-up window is Open");
}
</script>
<input type="button" value="Open pop-up window" onclick="function1();">
</body>
</html>



Let window navigate to a URL (window.navigate("http://www.java2s.com"))

 
    
<html>
<body>
<button onclick="window.navigate("http://www.wbex.ru");">Go to www.wbex.ru page</ 
button>
</body>
</html>



Move window By

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.moveBy(100,100);
    }
</script>
<input type="button" 
       value="Move the window 100 pixels to the left and 100 pixels" 
       onclick="function1();">
</body>
</html>



Move window to

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    window.moveTo(100,300);
}
</script>
<input type="button" value="Move window" onclick="function1();">
</body>
</html>



Navigate window to a URL

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.navigate("http://www.wbex.ru");
    }
</script>
<input id=myB 
       type="button" 
       value="Navigate to wbex.ru home page" 
       onclick="function1();">
</body>
</html>



"offScreenBuffering" Example

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.offScreenBuffering = false;
        var m = window.offScreenBuffering;
        alert("The value of offScreenBuffering for this window is: \n"+m);
    }
</script>
<input type="Button" 
       value="Turn "off" the offScreenBuffering of this window" 
       onClick="function1();">
</body>
</html>



Open a new Window

 
    
<html>
<body>
<input type="button" 
       value="Open a new window" 
       onClick="window.open("http://www.wbex.ru", "_blank")">
<input type="button" 
       value="Open a blank document" 
       onClick="document.open("test.htm", "_blank")">
</body>
</html>



Open a new window and close it

 
    
<html>
<body>
<script language="JavaScript">
    var newWin
    function function1() {
         newWin = window.open("http://www.wbex.ru", 
                              "subwindow", 
                              "width=400,height=150, left=200, resizable, top=250") 
    } 
    function hi() {
        if (!newWin.closed) {
            alert("The subwindow is closed");
        }
    }
</script>
<p style="text-decoration:underline; 
   cursor:hand;" 
   onClick="function1();">
   Click to open new window
</p>
</body>
</html>



Print a window

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.print();
    }
</script>
<input type="button" value="Print this window" onclick="function1();">
</body>
</html>



"screenTop" Example

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    var m = ""
    m = "The left coordinate is: " + window.screenLeft + "\n";
    m += "The top coordinate is: " + window.screenTop + "\n";
    alert(m); 
} 
</script>
<body bottommargin="150">
<input type="button" value="Extract the coordinates" onclick="function1();">
</body>
</html>



Set Default Status Information

 
    
<html>
<body>
<body bottommargin=150" 
      onLoad="window.defaultStatus="This is the status bar message"">
</body>
</html>



Set dialog window top

 
    
<html>
<body>
<SCRIPT>
function function1()
{
    event.srcElement.blur();
    window.showModalDialog("http://www.wbex.ru", "",
        "dialogWidth:5cm; dialogHeight:10cm; 
        dialogTop:0cm; dialogLeft:0cm")
}
</SCRIPT> 
</HEAD>
<BODY>
<SELECT onchange="function1()">
    <OPTION>Item 1</OPTION>
    <OPTION>Item 2</OPTION>
    <OPTION>Item 3</OPTION>
</SELECT>
</body>
</html>



Set dialog window width

 
    
<html>
<body>
<SCRIPT>
function function1()
{
    event.srcElement.blur();
    window.showModalDialog("http://www.wbex.ru", "", 
        "dialogWidth:5cm; dialogHeight:10cm")
}
</SCRIPT> 
</HEAD>
<BODY>
<SELECT onchange="function1()">
    <OPTION>Item 1</OPTION>
    <OPTION>Item 2</OPTION>
    <OPTION>Item 3</OPTION>
</SELECT>
</body>
</html>



Set the dialog window height

 
    
<html>
<body>
<SCRIPT>
function function1()
{
    event.srcElement.blur();
    window.showModalDialog("http://www.wbex.ru", "", 
        "dialogWidth:5cm; dialogHeight:10cm")
}
</SCRIPT> 
</HEAD>
<BODY>
<SELECT onchange="function1()">
    <OPTION>Item 1</OPTION>
    <OPTION>Item 2</OPTION>
    <OPTION>Item 3</OPTION>
</SELECT>
</body>
</html>



Set the dialog window left

 
    
<html>
<body>
<SCRIPT>
function function1()
{
    event.srcElement.blur();
    window.showModalDialog("http://www.wbex.ru", "",
        "dialogWidth:5cm; dialogHeight:10cm; 
        dialogTop:0cm; dialogLeft:0cm")
}
</SCRIPT> 
</HEAD>
<BODY>
<SELECT onchange="function1()">
    <OPTION>Item 1</OPTION>
    <OPTION>Item 2</OPTION>
    <OPTION>Item 3</OPTION>
</SELECT>
</body>
</html>



Set Timeout (window.setTimeout)

 
    
<html>
<body>
<script language="javascript">
    var intValue = 0
    function myMethod(){
        alert("Hello");
    }
</script>
<button onclick="intValue=window.setTimeout("myMethod()", 1000);">Start timeout</button>
<button onclick="intValue=window.clearTimeout(intValue);">Stop timeout</button>
</body>
</html>



Show a Popup

 
    
<html>
<body>
<script language="JavaScript">
var myPopup
function function1() {
    myPopup = window.createPopup();
    myPopup.document.body.style.backgroundColor = "yellow";
    myPopup.show(100,100,100,200,document.body); 
} 
</script>
<input type="button" value="Show popup window" onclick="function1();">
<input type="button" value="Hide popup window" onclick="myPopup.hide();">
</body>
</html>



Show Browser UI

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.external.ShowBrowserUI("LanguageDialog", null);
    }
    function function2() {
        window.external.ShowBrowserUI("OrganizeFavorites", null);
    }
    function function3() {
        window.external.ShowBrowserUI("PrivacySettings", null);
    }
</script>
<input type="button" 
       value="Open the Language Preferences dialog box." 
       onclick="function1();">
<input type="button" 
       value="Open the Organize Favorites dialog box." 
       onclick="function2();">
<input type="button" 
       value="Open the Privacy Preferences dialog box." 
       onclick="function3();">
</body>
</html>



Show Help (window.showHelp("URL"))

 
    
<html>
<body>
<script language="JavaScript">
    function function1() {
        window.showHelp("http://www.wbex.ru");
    }
</script>
<input type="button" value="Open the help document" onclick="function1();">
</body>
</html>



Show Modal Dialog (window.showModalDialog("URL", myArguments, ""))

 
    
<html>
<body>
<script language="JavaScript">
function openWindow() {
   var myArguments = new Object();
   myArguments.param1 = document.all.myColor.value;
   window.showModalDialog("http://www.wbex.ru", myArguments, ""); 
} 
</script>
<select id="myColor">
    <option value="red">Red</option>
    <option value="green">Green</option>
    <option value="blue">Blue</option>
    <option value="yellow">Yellow</option>
</select>
<button onclick="openWindow();">Open window</button>
</body>
</html>



Show Modeless Dialog (window.showModelessDialog(..))

 
    
<html>
<body>
<script language="JavaScript">
function openWindow() {
   var myArguments = new Object();
   myArguments.param1 = document.all.myColor.value;
   window.showModelessDialog("http://www.wbex.ru", myArguments, ""); 
} 
</script>
<select id="myColor">
    <option value="red">Red</option>
    <option value="green">Green</option>
    <option value="blue">Blue</option>
    <option value="yellow">Yellow</option>
</select>
<button onclick="openWindow();">Open window</button>
</body>
</html>



Windown screen Left

 
    
<html>
<body>
<script language="JavaScript">
function function1() {
    var m = ""
    m = "The left coordinate is: " + window.screenLeft + "\n";
    m += "The top coordinate is: " + window.screenTop + "\n";
    alert(m); 
} 
</script>
<body bottommargin="150">
<input type="button" value="Extract the coordinates" onclick="function1();">
</body>
</html>



Window resize By

 
    
<html>
<body>
<script language="JavaScript">
    function function1(){
        window.resizeBy(-100,-100);
    }
</script>
<input type="button" value="Resize this window by (-100,-100)" onClick="function1();">
</body>
</html>



Window self

 
    
<html>
<body id="myBody" bottommargin=150>
<script language="JavaScript">
    function function1() {
        alert(window.self.myBody.bottomMargin);
    }
</script>
<input type="button" value="Bottom Margin" onclick="function1();">
</body>
</html>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/Javascript_Objects/window&oldid=2703»