//==============================================================
JavaScript Window Screen
//=======
<!DOCTYPE html><html>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Screen width is " + screen.width +
"<br>Screen height is " +screen.height +
"<br>Screen availwidth is " +screen.availWidth +
"<br>Screen availheight is " +screen.availHeight +
"<br>Screen colordepth is " +screen.colorDepth +
"<br>Screen pixeldepth is " +screen.pixelDepth;
</script>
</body>
</html>
//===========================================================
JavaScript Window Location
//===========
<!DOCTYPE html>
<html>
<body>
<p>Display the entire URL of the current page.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Page location is: " + window.location.href +
"<br>Page hostname is: " + window.location.hostname+
"<br>Page Pathname is: " + window.location.pathname +
"<br> Page protocol is:" + window.location.protocol +
"<BR> Page Assign to is: " + window.location.assign("http://www.w3schools.com");
</script>
</body>
</html>
//=========================================================
JavaScript Window
//=============
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
var x = document.getElementById("demo");
x.innerHTML = "Browser inner window width: " + w + ", height: " + h + ".";
</script>
</body>
</html>
//=============================================================
JavaScript Window History
//=========
<!DOCTYPE html>
<html>
<body>
<script>
function goBack() {
window.history.back()
}
</script>
</head>
<body>
<input type="button" value="Back" onclick="goBack()">
<script>
function goForward() {
window.history.forward()
}
</script>
</head>
<body>
<input type="button" value="Forward" onclick="goForward()">
</body>
</html>
//=============================================================
JavaScript Popup Boxes
//=========
<!DOCTYPE html>
<html>
<body>
<p>Click the button to demonstrate the prompt box.</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
alert("I am an alert box\n and i will test ur skills!");
var person = prompt("Please enter your name", "Harry Potter");
if (person != null) {
document.getElementById("demo").innerHTML =
"Hello " + person + "! How are you today?";
}
var r = confirm("Your Name is :" + person);
if (r == true) {
alert("You accepted that your name is : " + person);
} else {
alert("You rjected that your name is : " + person);
}
}
</script>
</body>
</html>
//=========================================================
JavaScript Timing Events
//=============
<!DOCTYPE html>
<html>
<body>
<p>Click "Try it". Wait 3 seconds. The page will alert "Hello".</p>
<p>Click "Stop" to prevent the first function to execute.</(p>
<p>(You must click "Stop" before the 3 seconds are up.)</p>
<button onclick="myVar = setTimeout(myFunction, 3000)">Try it</button>
<button onclick="clearTimeout(myVar)">Stop it</button>
<script>
function myFunction() {
alert("Hello");
}
</script>
<p>A script on this page starts this clock:</p>
<p id="demo"></p>
<button onclick="clearInterval(myVar)">Stop time</button>
<script>
var myVar = setInterval(myTimer ,1000);
function myTimer() {
var d = new Date();
document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}
</script>
<button onclick="timedText()">Try it</button>
<p id="demo1">Click on "Try it". I will display when two, four, and six seconds have passed.</p>
<script>
function timedText() {
setTimeout(myTimeout1, 2000)
setTimeout(myTimeout2, 4000)
setTimeout(myTimeout3, 6000)
}
function myTimeout1() {
document.getElementById("demo1").innerHTML = "2 seconds";
}
function myTimeout2() {
document.getElementById("demo1").innerHTML = "4 seconds";
}
function myTimeout3() {
document.getElementById("demo1").innerHTML = "6 seconds";
}
</script>
<script>
function startTime() {
var today = new Date();
var h = today.getHours();
var m = today.getMinutes();
var s = today.getSeconds();
m = checkTime(m);
s = checkTime(s);
document.getElementById('txt').innerHTML =
h + ":" + m + ":" + s;
var t = setTimeout(startTime, 500);
}
function checkTime(i) {
if (i < 10) {i = "0" + i}; // add zero in front of numbers < 10
return i;
}
</script>
</head>
<body onload="startTime()">
<div id="txt"></div>
</body>
</html>
//===========================================================
JavaScript Cookies
//===========
<!DOCTYPE html>
<html>
<head>
<script>
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
alert("ca.length" + ca.length );
alert("ca -- > " + ca);
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
alert("ca["+i+"] : " + ca[i]);
while (c.charAt(0) == ' ') {
c = c.substring(1);
alert("c"+c);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
function checkCookie() {
var username = getCookie("username");
if (username != "") {
alert("Welcome again " + username);
} else {
username = prompt("Please enter your name:", "");
if (username != "" && username != null) {
setCookie("username", username, 365);
}
}
}
</script>
<body onload="checkCookie()">
<div id="txt"></div>
</body>
</html>
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
//======================================================================
Comments