asked on

javascript hide layer in 10 second

Dear Experts

I'd like to hide a layer after 10 second,
I have a flash inside that layer,
how can I make it invisible after 10 second?
do you have the javascript code for this
thank you in advance

roxviper

you can use these example

#
<?xml version="1.0" encoding="utf-8"?>
#
<?xml-stylesheet type="text/css" href="#internal-style"?>
#
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
#
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
#
<html id="xhtml10" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
#
<head>
#
<meta http-equiv="X-UA-Compatible" content="IE=5; IE=EmulateIE7; IE=8" />
#
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
#
<meta http-equiv="Content-Script-Type" content="text/javascript" />
#
<meta http-equiv="Content-Style-Type" content="text/css" />
#
<title>Countdown timer to hide my div's</title>
#
<style id="internal-style" type="text/css">
#
/* <![CDATA[ */
#
 
#
body > div {
#
background-color: #eee;
#
color: #405060;
#
margin: 0 auto;
#
height: 300px;
#
width: 500px;
#
padding: 1em;
#
text-align: center; }
#
 
#
div span {
#
display: table-cell;
#
vertical-align: middle;
#
height: 300px;
#
width: 100%; }
#
 
#
div.display-none {
#
display: none; }
#
 
#
div.display-table {
#
display: table; }
#
 
#
/* ]]> */
#
</style>
#
<script type="text/javascript">
#
/* <![CDATA[ */
#
// Moded
#
 
#
var browser = function( ids ) {
#
if ( document.all )
#
return document.all[ids];
#
else if ( document.getElementById )
#
return document.getElementById( ids );
#
else
#
return document.layers[ids];
#
};
#
 
#
var num, milisec = 0;
#
var seconds = 15;
#
var stop = function( arg ) {
#
return clearTimeout( arg ); }
#
function hideAgain()
#
{
#
if ( seconds === 15 )
#
try { browser("myDiv").className = "display-none";
#
display();
#
} catch( error ) {
#
alert("Unable to hide div!");
#
}
#
}
#
 
#
function display() {
#
if ( seconds !== 0 && browser ) {
#
try {
#
browser('counter').d2.value = seconds;
#
}
#
catch( e ) {
#
alert("\nFailed to execute script!");
#
}
#
}
#
num = setTimeout("display()", 1000);
#
 
#
if ( seconds <= 0 ) {
#
try { browser("myDiv").className = "display-table";
#
stop( num ); seconds = 15;
#
} catch( err ) {
#
alert("Unable to clear timer!");
#
} return;
#
}
#
 
#
seconds--;
#
}
#
 
#
// Its up to you on how you want to trigger these function.
#
 
#
// in this example i will incoporate it with the ONLOAD event.
#
window.onload = display;
#
 
#
/* ]]> */
#
</script>
#
</head>
#
<body>
#
<div id="myDiv" class="display-none"><span>#JavaScript Demo</span></div>
#
<form action="#" id="counter" onsubmit="return false;">
#
<div>
#
<label for="d2">Timer: <input type="text" id="d2" name="d2" size="4" value="" /></label> <input type="button" id="btn" name="btn" value="Hide" onclick="hideAgain()" />
#
</div>
#
</form>
#
</body>
#
</html>

Open in new window

ASKER CERTIFIED SOLUTION

Sreedhar Vengala

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial