Microwaver
Legacy Member
Dag mensen.
Ik heb een klein probleempje met de tabs van volgende site.
Ik weet niet hoe het komt maar in IE worden de tabs niet weergegeven als ik met mijn muis over de drie links ga.
Hoe kan ik dit oplossen?
VOlgende codes zijn gebruikt :
en voor CSS (het navigatie gedeelte)
Ik heb een klein probleempje met de tabs van volgende site.
Ik weet niet hoe het komt maar in IE worden de tabs niet weergegeven als ik met mijn muis over de drie links ga.
Hoe kan ik dit oplossen?
VOlgende codes zijn gebruikt :
Code:
<!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>B2B-C Home</title>
<link href="index.css" rel="stylesheet" type="text/css" />
<link href="navigation.css" rel="stylesheet" type="text/css" />
<script type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
//--><!]]></script>
</head>
<body>
<div id="header">
<div id="top_header">HEADER 1</div>
<div id="login_header">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="left">
User ID
</td>
<td class="right"><input name="user ID" type="text" maxlength="30" class="textbox" />
</td>
</tr>
<tr>
<td class="left">
Password
</td>
<td class="right">
<input name="password" type="password" maxlength="30" class="textbox" />
</td>
</tr>
<tr>
<td class="left">
Language
</td>
<td class="right">
<select name="menu1" onchange="MM_jumpMenu('parent',this,0)" class="dropdown">
<option value="#">Nederlands</option>
<option value="#">English</option>
<option value="#">Français</option>
<option value="#">Espagnol</option>
<option value="#">Deutsch</option>
</select>
</td>
</tr>
<tr>
<td colspan="2">
<form action="profiel/profiel1.html">
<input name="Inloggen" type="submit" value="Inloggen" />
</form>
</td>
</tr>
</table>
<table>
<tr>
<td colspan="2">
<a href="http://www.google.be">Passwoord vergeten?</a>
</td>
</tr>
<tr>
<td colspan="2">
<a href="#">Gratis lid worden voor particulieren</a>
</td>
</tr>
<tr>
<td colspan="2">
<a href="aanmelden/aanmelden_bedrijf.html">Aanmelden als bedrijf</a>
</td>
</tr>
</table>
</div>
</div>
<div id="center">
<div class="left">Detailhandelaar</div>
<div class="center">
<div class="subheader">
</div>
<div class="menu">
<div id="menuheader">
<ul>
<li class="current">
<a href="index.html">
Home
</a>
<ul>
<li>
<a href="profielen/profiel bekijken/bekijk_uitgebreid.html">mijn profiel</a> </li>
<li>
<a href="profielen/profiel bekijken/bekijk_uitgebreid.html">mijn foto's</a> </li>
<li>
<a href="profielen/profiel bewerken/bewerk_mtsch.html">mijn account</a> </li>
<li>
<a href="profielen/profiel bewerken/bewerk_mtsch.html">mijn instellingen</a> </li>
</ul>
</li>
<!-- Active Tab -->
<li class="current">
<a href="zoeken/snelzoeken.html">
Zoeken </a>
<ul>
<li><a href="zoeken/snelzoeken.html">beperkt zoeken</a></li>
<li><a href="zoeken/trefwoorden.html">zoeken op trefwoorden</a></li>
<li><a href="zoeken/uitgebreidzoeken.html">uitgebreid zoeken</a></li>
<li><a href="zoeken/alleszoeken.html">volledig zoeken</a></li>
</ul>
</li>
<!-- // Active Tab -->
<li class="current">
<a href="index.html">
Mijn Website </a>
<ul>
<li><a href="offerte.html">gegevens wijzigen</a></li>
<li><a href="openings.css">toon website</a></li>
</ul>
</li>
</ul>
</div>
</div>
<h1> </h1>
</div>
<div class="right">groothandel</div>
</div>
<div id="footer">
<div>
<img src="images/fnc.gif" alt="fnc_logo" class="fnc"/>
<img src="images/surplus.gif" alt="surplus_logo" class="surplus"/>
<img src="images/belgiumservices.gif" alt="coface_belgium" class="coface"/>
</div>
</div>
</body>
</html>
en voor CSS (het navigatie gedeelte)
Code:
#menuheader {
float:left;
width:100%;
font-size:93%;
line-height:normal;
}
#menuheader ul {
margin:0;
padding:0px 10px 0;
list-style:none;
list-style-image:none;
}
#menuheader li {
float:left;
background:url(../images/left.gif) no-repeat left top;
margin:0;
padding:0 2px 0 13px;
list-style-image:none;
position:relative;
}
#menuheader li ul{
padding-left:0px;
margin-left:0px;
}
#menuheader li li{
width:15em;
background-color:#FFC9AE;
border-bottom:1px solid #CC9900;
border-right:1px solid #CC9900;
border-left:1px solid #CC9900;
background-image:none;
}
li ul { /* sub items */
display: none;
position: absolute;
top: 1em;
left: 0;
}
li>ul { /* postitie resetten voor alle browsers behalve IE */
top: auto;
left: auto;
}
li:hover ul, li.over ul { /* lists nested onder hovered list items */
display: block;
}
#content {
clear: left;
}
#menuheader a {
float:left;
display:block;
background:url(../images/right.gif) no-repeat right top;
padding:5px 15px 4px 2px;
text-decoration:none;
font-weight:bold;
color:#333333;
}
#menuheader li li a{
background:none;
border:0;
padding-top:0;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
#menuheader a {float:none;color:}
/* End IE5-Mac hack */
#menuheader .current {
background-image:url(../images/left_on.gif);
}
#menuheader .current a {
background-image:url(../images/right_on.gif);}
#menuheader li.current li a{
background-image:none;
background:none;
padding-top:0;
}
/* LINKS */
#menuheader a:link {
color: #333333;
}
#menuheader a:visited {
color: #333333;
}
#menuheader a:hover {
color: #996600;
}
#menuheader a:active {
color: #333333;
}
/* Content Adaptation */
/* TOP */