0% found this document useful (0 votes)
9 views4 pages

Css Exp 11 PDF Updated Tuesday

Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
9 views4 pages

Css Exp 11 PDF Updated Tuesday

Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Name: Ansari Abdullah Roll no: 220402

Sub: Client-Side Scripting (CSS) Branch: CO

Experiment No. 11: Develop a webpage for placing the window on the
screen and working with child window
1. Write a program to create a child window from a parent window. Shift focus to child
window.
CODE:
<html>
<body>
<button onclick="myFunction()">Try</button>
<script>
function myFunction() {
var myWindow = window.open("", "", "width=200,height=100");
myWindow.document.write("<p>Ansari Abdullah-220402!</p>");
myWindow.focus();
}
</script>
</body>
</html>

OUTPUT:

2. Write a program for accessing elements of child window.


CODE:
<html> <input type="button" id="btn2"
<head> <title> value="send" onclick="sendval()">
Accessing child window elements. <script>
</title> var popchild;
</head><body> function openchild()
<input type="text" id="txt1" {
value=""/><br> popchild=window.open("child.html
<input type="button" id="btn1" ");
value="open" }
onclick="openchild()"> function sendval() {
if (popchild!=null && }
!popchild.closed) { else {
var p = alert("Child window
popchild.document.getElementByI has been closed.");
d("demo"); }
}
p.innerHTML=document.getEleme </script>
ntById("txt1").value; </body></html>
popchild.focus();

Child.html
<html>
<head>
<title>
Child window
</title>
</head>
<body>
<p id="demo"></p>
<p>Ansari Abdullah-220402</p>
</body>
</html>
OUTPUT:

3. Write a Program to use the Browser Object (Location Object) in JavaScript.


CODE:
<html>
<body>
<p>Click the button to get your coordinates.</p>
<button onclick="getLocation()">Try It</button>
<script>
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else { document.write("Geolocation is not supported by this browser.");
}}
function showPosition(position) {
document.write("Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude);
}
</script>
</body></html>

OUTPUT:

4. Write a Program to use the Browser Object (Window Object) in JavaScript. Use all
function related to window object.
CODE:
<html> <button
<body> onclick="f7()">ScrollBy</button>
<button onclick="f1()">Open <br><br>
</button><br><br> <button
<button onclick="f9()">Close</button><br
onclick="f2()">MoveTo</button>< >
br><br> <p>Ansari Abdullah-220402</p>
<button <script>
onclick="f3()">MoveBy</button> var myWindow;
<br><br> function f1() {
<button myWindow=window.open("",
onclick="f4()">ResizeTo</button> "myWindow", "width=200,
<br><br> height=100");
<button myWindow.document.write("<p>T
onclick="f5()">ResizeBy</button> his is 'myWindow'</p>");}
<br><br> function f2() {
<button myWindow.moveTo(500, 100);
onclick="f6()">ScrollTo</button> myWindow.focus();}
<br><br> function f3() {
myWindow.moveBy(250, 250);
myWindow.focus();}
function f4() { function f7() {
myWindow.resizeTo(250, 250); myWindow.scrollBy(200,200);}
myWindow.focus();} function f9() {
function f5() { myWindow.close();}
myWindow.resizeBy(250, 250); </script>
myWindow.focus();} </body>
function f6() { </html>
myWindow.scrollTo(200,200);}

OUTPUT:

5. Write a Program to use the History Object in JavaScript


CODE:
<html>
<body>
<h1>The Window History Object</h1>
<h2>The history.length Property</h2>
<p>Number of URLs in history list:</p>
<p id="demo"></p>
<p>Since this is a new window frame, history.length will always return 1.</p>
<script>
let length = history.length;
document.getElementById("demo").innerHTML = length;
</script>
</body>
</html>

OUTPUT:

You might also like