Solved

5 sec display banner on all page

Posted on 2008-10-05
6
170 Views
Last Modified: 2012-05-05
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
Comment
Question by:Sasha-N
  • 3
  • 2
6 Comments
 
LVL 82

Expert Comment

by:hielo
ID: 22645338
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
 

Author Comment

by:Sasha-N
ID: 22645368
if it will work on mozila too that will be perfect:(
0
 
LVL 82

Accepted Solution

by:
hielo earned 500 total points
ID: 22645405

<!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
 

Author Comment

by:Sasha-N
ID: 22645433
great! but how i make the image be on the center middle...right now its outside the page on the right side
0
 
LVL 82

Expert Comment

by:hielo
ID: 22645447
read the comment in the css portion of the example.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
jQuery Parallax 1 38
jQuery Syntax 2 47
How to turn a javascript bookmark into a hyperlink online 9 29
Why my select dropdown does not work? 8 21
Avoid defining the variables in the global scope; trying to define them in a local function scope. Because:   • Look-up is performed every time a variable is accessed.   • Variables are resolved backwards from most specific to least specific scope…
When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

919 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now