lidt hjælp til en menu
Jeg vil godt ha menu.html ind i index.html Men med index i index hvor der stå HERher ny prøve mange ting for at fo det vil at virke men kan ikke hitte ud af det
her er menu html og dens css
.menu {
position:relative;
background-color:gold;
border:1px solid darkblue;
width:150;
font-size:11px;
font-family:verdana;
font:bold;
position:absolute;
cursor:se-resize;
}
.item_panel {
width:150;
border-left:1px solid darkblue;
border-right:1px solid darkblue;
clip:rect(0,150,0,0);
position:absolute;
}
.item_panel a {
text-decoration:none;
color:black;
cursor:hand;
}
.item {
background-color:lightyellow;
width:148;
font-size:10px;
font-family:verdana;
}
<!-- Paste this code into the HEAD section of your HTML document.
You may need to change the path of the file. -->
<script type="text/javascript" src="sliding_menu.js.js"></script>
<!-- Paste this code into the BODY section of your HTML document -->
<table width=150><tr><td>
<script language="JavaScript">
//Link[nr] = "position [0 is menu/1 is item],Link name,url,target (blank|top|frame_name)"
var Link = new Array();
Link[0] = "0|Home";
Link[1] = "1|Home|http://www.javascriptsource.com|";
Link[2] = "1|More Scripts|http://www.javascript.com|";
Link[3] = "1|Contact|http://www.javascriptsource.com/contact-us.html|";
Link[4] = "1|Traffic|http://www.thecounter.com|";
Link[5] = "0|Access";
Link[6] = "1|Login|Login.asp|";
Link[7] = "1|Logout|Logout.asp|"
Link[8] = "0|Scripts";
Link[9] = "1|Asp|http://www.javascriptsource.com|";
Link[10] = "1|JavaScript|http://www.javascriptsource.com|";
Link[11] = "0|Links";
Link[12] = "1|JavaScript sites|http://www.javascripts.com|blank";
startup(4);
</script>
</td></tr></table>
------------------------------------------
her er index og dens index
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Sparse 'n Clean</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main">
<div id="navigation">
PAGE NAVIGATION
<a href="#" class="navigation">LINK</a> <---- der hvor det link er vil jeg godt bruge det andent link sytem tak og tabeler skal udskifes med div
</div>
</body>
</html>
body {
margin: 25px 0px 0px 0px;
background-color: #FFFFFF;
background-image: url(images/bg.gif);
background-position: center;
background-repeat: repeat-y;
text-align: center;
}
/***********************************
CONTAINERS
***********************************/
#main {
width: 720px;
margin-left: auto;
margin-right: auto;
text-align: left;
background-color: #FFFFFF;
}
#top-nav {
width: 715px;
margin-left: auto;
margin-right: auto;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 55%;
color: #999999;
text-align: right;
vertical-align: bottom;
height: 18px;
line-height: 18px;
padding-right: 5px;
border-width: 0px 0px 1px 0px;
border-style: solid;
background-color: #FFFFFF;
}
#navigation {
float: left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 70%;
font-weight: bold;
color: #FF9900;
background-color: #FAFAFA;
text-decoration: none;
margin: 0px 0px 0px 0px;
padding: 5px 5px 15px 5px;
width: 150px;
border-color: #CCCCCC;
border-style: solid;
border-width: 0px 1px 1px 0px;
text-align: right;
}
#content {
margin-left: 170px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 70%;
color: #666666;
text-decoration: none;
width: 535px;
text-align: left;
padding: 5px 5px 15px 5px;
background-color: #FFFFFF;
}
#footer {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 70%;
color: #999999;
padding: 40px 0px 10px 0px;
text-align: center;
clear: left;
background-color: #FFFFFF;
}
/***********************************
LINKS
***********************************/
a {
color: #666666;
text-decoration: none;
}
a:hover {
color: #FF0066;
text-decoration: none;
}
a.indbakke-emne {
color: #666666;
text-decoration: none;
}
a.indbakke-afsender {
color: #666666;
text-decoration: none;
text-align: left;
float: left;
width: 150px;
height:20px;
display: block;
}
a.indbakke-emne {
color: #666666;
text-decoration: none;
text-align: left;
width: 130px;
height:20px;
display: block;
float: left;
}
a.indbakke-dato {
color: #666666;
text-decoration: none;
text-align: left;
float: right;
width: 180px;
height:20px;
display: block;
}
a.indbakke-checkbox {
color: #666666;
text-decoration: none;
text-align: left;
float: left;
}
a.indbakke-foto {
color: #666666;
text-decoration: none;
text-align: left;
float: left;
display: block;
height:20px;
width: 20px;
}
a.indbakke-foto {
color: #666666;
text-decoration: none;
text-align: left;
float: left;
display: block;
height:20px;
width: 20px;
}
a.indbakke-ny {
color: #999999;
text-decoration: none;
}
a.small-navigation {
color: #999999;
text-decoration: none;
}
a.small-navigation:hover {
color: #FF9900;
}
a.navigation {
color: #666666;
border-width: 0px 0px 0px 5px;
border-color: #DEDEDE;
border-style: solid;
text-decoration: none;
display: block;
padding: 3px 0px 3px 5px;
text-align: left;
font-weight: normal;
}
a.navigation:hover {
border-color: #FF9900;
background-color: #EFEFEF;
}
/***********************************
MISCELLANEOUS
***********************************/
#header {
padding: 5px 0px 5px 0px;
border-color: #999999;
border-style: solid;
border-width: 0px 0px 1px 0px;
background-color: #FFFFFF;
}
hr {
width: 100%;
height: 0px;
text-align: center;
border-color: #CCCCCC;
border-style: dashed;
border-width: 0px 0px 1px 0px;
}
h1 {
color: #FF9900;
font-size: 180%;
text-decoration: none;
text-align: right;
margin: 0px 0px 15px 0px;
font-weight: normal;
padding: 2px 50px 0px 0px;
border-width: 1px 0px 0px 0px;
border-style: solid;
border-color: #FF9900;
background-color: #FFFFFF;
}
p {
border-color: #999999;
border-style: dashed;
border-width: 0px 0px 1px 0px;
padding: 0px 0px 10px 0px;
margin-top: 10px;
}
------------------------------------------------------
