CSS / JavaScript
Hej,Jeg vil gerne placere to div tags: en menu og en footer - henover mit javascript images slideshow, men jeg kan ikke finde ud af det! Det virker fint hvis det bare er et <img> tag som ligger nederst, men ikke når scriptet ligger nederst! Nogen der kender en løsning?
Inspiration kommer fra: http://www.paulsmith.co.uk/collections/
Her er mit site: http://knarf.dk
index.html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Don*Gnu</title>
<link rel="stylesheet" type="text/css" href="../css/style1.css" />
</head>
<body>
<div id="mainContainer">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="http://www.knarf.dk/pics/fpslideshowvar.php" type="text/javascript"></script>
<script type="text/javascript" src="fpslideshow.js"></script>
<!-- <img src="pics/phine1.jpg" alt="" border="0" width="100%" /> -->
<div id="menu">
<span style="font-size:16px; color:#FFFFFF; font-weight:bold;">Don*Gnu</span>
<span style="color: #000000; font-weight:bold; padding-left: 45px;">
| .......... | .......... | .......... |
</span>
</div>
</div>
<div id="footer">©2011 Don*Gnu</div>
<p style="color:#FFFFFF; font-weight:bold;"> Hvis du gør vinduet lidt bredere eller lavere - så kommer det hele til at se federe ud!</p>
</div>
</body>
</html>
CSS:
body {
z-index:1;
margin:0px;
padding:0px;
overflow: hidden;
background-color: #999999;
font-family:Verdana, Arial, Helvetica, sans-serif;
}
div#mainContainer {
z-index:10;
position:absolute; top:0%; left:0%;
margin: auto;
width: 100%;
height: 100%;
padding-top: 0px;
padding-bottom: 0px;
background-color: #333333;
}
div#menu {
z-index:50;
position:absolute; top:5%; left:0%;
margin: auto;
width: 100%;
height: 45px;
padding-top: 25px;
padding-left: 45px;
background-color: #FF0000;
opacity:0.6;
filter:alpha(opacity=60); /* For IE8 and earlier */
}
div#footer {
z-index:100;
position:absolute; top:95%; left:0%;
margin: auto;
width: 100%;
height: 20px;
padding-bottom: 0px;
background-color: #FF0000;
padding-left: 10px;
opacity:0.6;
filter:alpha(opacity=60); /* For IE8 and earlier */
}
TAK - vh Frank
