Need help with Javascript

GeorgeFowler · October 9, 2014

I would like to put an ad delay onto a webpage. No content shows up (complete white backgorund) until 30 seconds after viewing the ad. The ad would disappear and the content of the page would load up.

Frank_b · October 9, 2014



<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>Untitled Document</title>

<style>

#advert {

	display:none;

	border: solid 1px black;

    position: fixed;

    left: 50%;

    top: 50%;

    background-color: white;

    z-index: 100;


    height: 400px;

    margin-top: -200px;


    width: 600px;

    ;


}

</style>

<script>

window.onload = function() {

	var ad = document.getElementById('advert');


	setTimeout(function() {

		ad.style.display = 'block';

	}, 3000);


	document.getElementById('close').onclick = function() {

		ad.style.display = 'none';

                return false;

	}

}

</script>

</head>


<body>

<h3>Wait ...</h3>

<div id="advert">Hello this is an Advert!<a id="close" href="#">Close</a></div>

</body>

</html>

GeorgeFowler · October 9, 2014

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
#advert {
	display:none;
	border: solid 1px black;
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: white;
    z-index: 100;

    height: 400px;
    margin-top: -200px;

    width: 600px;
    ;

}
</style>
<script>
window.onload = function() {
	var ad = document.getElementById('advert');
	
	setTimeout(function() {
		ad.style.display = 'block';
	}, 3000);
	
	document.getElementById('close').onclick = function() {
		ad.style.display = 'none';
                return false;
	}
}
</script>
</head>

<body>
<h3>Wait ...</h3>
<div id="advert">Hello this is an Advert!<a id="close" href="#">Close</a></div>
</body>
</html>

Kind of like that but the ad should show onto the page first befoe anything else for a number of seconds before it disappears and the content of the pageis seen. I'm a php coder and no nothing of javascript besides how to read it otherwise I would do it myself. I appreciate the script snip and would love it if you could fix it the way I want it to work.

Frank_b · October 9, 2014

Like this?

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
#page {
	display:none;
}

#advert {
	border: solid 1px black;
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: white;
    z-index: 100;

    height: 400px;
    margin-top: -200px;

    width: 600px;
    ;

}
</style>
<script>
window.onload = function() {
	setTimeout(function() {
		document.getElementById('advert').style.display = 'none';
		document.getElementById('page').style.display = 'block';
	}, 3000);
}
</script>
</head>

<body>
<div id="page">
<h3>Hello</h3>
<p>Welcome on my website</p>
</div>
<div id="advert">Hello this is an Advert!</div>
</body>
</html>

GeorgeFowler · October 9, 2014

Like this?

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
#page {
	display:none;
}

#advert {
	border: solid 1px black;
    position: fixed;
    left: 50%;
    top: 50%;
    background-color: white;
    z-index: 100;

    height: 400px;
    margin-top: -200px;

    width: 600px;
    ;

}
</style>
<script>
window.onload = function() {
	setTimeout(function() {
		document.getElementById('advert').style.display = 'none';
		document.getElementById('page').style.display = 'block';
	}, 3000);
}
</script>
</head>

<body>
<div id="page">
<h3>Hello</h3>
<p>Welcome on my website</p>
</div>
<div id="advert">Hello this is an Advert!</div>
</body>
</html>

Yeah I can work off from that. That works great! Thanks

Frank_b · October 9, 2014

Welcome :-)

Sign In

Need help with Javascript

Recommended Posts

GeorgeFowler

Link to comment

Share on other sites

Frank_b

Link to comment

Share on other sites

GeorgeFowler

Link to comment

Share on other sites

Frank_b

Link to comment

Share on other sites

GeorgeFowler

Link to comment

Share on other sites

Frank_b

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information