Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 180
  • Last Modified:

5 sec display banner on all page

i have a regular html page...
i want that each user will enter this page he will see for the first 5 sec a white screen and
the logo.gif file on the middle center.
don't wonna use flash.

how can i do it with javascript in a way that google wont punish me?
0
Sasha-N
Asked:
Sasha-N
  • 3
  • 2
1 Solution
 
hieloCommented:
try:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<title></title> 
<style type="text/css">
/* depending on the size of your image, you will need to adjust the values for 
padding-top and padding-left until it is centered */
#banner{position:absolute;top:0px;left:0px;background-color:white;width:100%;height:100%;padding-top:19%;padding-left:35%;} 
body{background-color:black;height:100%;color:white;}
</style> 
<script type="text/javascript">
 window.onload=init;
function init(){
	setTimeout(function(){document.getElementById("banner").removeNode(true);}, 5000);
}
</script>
</head>
<body>
	<div id="banner">
		<img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="">
	</div>
	<div>Content goes here...Content goes here...Content goes here...Content goes here...Content goes here...</div>
</body>
</html>

Open in new window

0
 
Sasha-NAuthor Commented:
if it will work on mozila too that will be perfect:(
0
 
hieloCommented:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
 "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<title></title> 
<style type="text/css">
/* depending on the size of your image, you will need to adjust the values for 
padding-top and padding-left until it is centered */
#banner{position:absolute;top:0px;left:0px;background-color:white;width:100%;height:100%;padding-top:19%;padding-left:35%;} 
body{background-color:black;height:100%;color:white;}
</style> 
<script type="text/javascript">
 window.onload=init;
function init(){
	setTimeout("trashIt()", 5000);
}
function trashIt(){
	var n =document.getElementById("banner");
	n.parentNode.removeChild(n);
}
</script>
</head>
<body>
	<div id="banner">
		<img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="">
	</div>
	<div>Content goes here...Content goes here...Content goes here...Content goes here...Content goes here...</div>
</body>
</html>

Open in new window

0
 
Sasha-NAuthor Commented:
great! but how i make the image be on the center middle...right now its outside the page on the right side
0
 
hieloCommented:
read the comment in the css portion of the example.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now