Gøre "tap" aktiv med javascript ?
Hejsa,Jeg har følgende css, html og javascript jeg gerne vil have til at fungere så den "tab" der bliver klikket på bliver den aktive :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<style type="text/css">
body
{
background:#fff;
margin:0;
padding:0;
color:#000;
font-family:Verdana;
font-size:8pt;
/*voice-family: "\"}\""; voice-family:inherit;*/
font-size:small;
}
/*html>body {font-size:small;}*/
#header
{
float:left;
width:100%;
background:#DAE0D2 url("bg.gif") repeat-x bottom;
font-size:93%;
line-height:normal;
}
#header ul
{
margin:0;
padding:10px 10px 0;
list-style:none;
}
#header li
{
float:left;
background:url("left.gif") no-repeat left top;
margin:1px;
padding:0 0 0 9px;
}
#header a
{
float:left;
display:block;
background:url("right.gif") no-repeat right top;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color:#765;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
#header a {float:none;}
/* End IE5-Mac hack */
#header a:hover
{
color:#333;
}
#header .current
{
background-image:url("left_on.gif");
}
#header .current a
{
background-image:url("right_on.gif");
color:#333;
padding-bottom:5px;
}
</style>
<script language="javascript">
function setSearchOptions(idElement)
{
/* Total Tabs above the input field (in this case there are 3 tabs: web, images, videos) */
tot_tab = 5;
tab = document.getElementById('tab'+idElement);
for(i=1; i<=5; i++)
{
if(i==idElement)
{
tab.setAttribute("class","current");
}
else
{
document.getElementById('tab'+i).setAttribute("class","");
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="header">
<ul>
<li id="tab1"><a href="#" onclick="java script:setSearchOptions(1);">Home</a></li>
<li id="tab2" class="current"><a href="#" onclick="java script:setSearchOptions(2);">News</a></li>
<li id="tab3"><a href="#" onclick="java script:setSearchOptions(3);">Products</a></li>
<li id="tab4"><a href="#" onclick="java script:setSearchOptions(4);">About</a></li>
<li id="tab5"><a href="#" onclick="java script:setSearchOptions(5);">Contact</a></li>
</ul>
</div>
</form>
</body>
</html>
Håber der er en der kan hjælpe mig det sidste stykke vej ;o)
../
