Hola a todos los miembros de este foro.
es mi primera vez que entro a este foro, quisiera ver la manera de que me pudieran ayudar con este menu. no encuentro ningun script en la red. o quisas no abia buscado en el lugar correcto.
Aqui les doy el link del menu que kieor hacer.:
http://electricalsupport.com.mx/es/

aki les dejo el codigo ek yo ise pero no es lo ke yo estoy buscando.

codigo CSS

#tabsI {
float:left;
width:100%;

background:#EFF4FA;
font-size:93%;
line-height:normal;
border-bottom:1px solid #DD740B;
}
#tabsI ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsI li {
display:inline;
margin:0;
padding:0;
}
#tabsI a {
float:left;
background:url("tableftI.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}
#tabsI a span {
float:left;
display:block;
background:url("tabrightI.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}

#tabsI a span {float:none;}
/* End IE5-Mac hack */
#tabsI a:hover span {
color:#FFF;
}
#tabsI a:hover {
background-position:0% -42px;
}
#tabsI a:hover span {
background-position:100% -42px;
}

codigo HTML

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="../imagenes/favicon.ico" />
<title>Junyka Electric... Mas Que un Proveedor Su Asesor de Confianza</title>
<link rel="stylesheet" href="color.css" type="text/css" media="screen">
</head>

<body>
<div id="tabsI">
<ul>
<li><a href="#" title="Link 1"><span>Nosotros</span></a></li>
<li><a href="#" title="Link 2"><span>Quienes Somos</span></a></li>
<li><a href="#" title="Link 3"><span>Fabricacion</span></a></li>
<li><a href="#" title="Link 4"><span>Productos</span></a></li>
<li><a href="#" title="Link 5"><span>Clientes</span></a></li>
<li><a href="#" title="Link 6"><span>Catalogo</span></a></li>
<li><a href="#" title="Link 7"><span>Contactanos</span></a></li>
</ul>
</div>
</body>
</html>

mi pregunta es si con este codigo se pudiera modificar y haserlo como el del link de arriba.

Saludos
porfavor ayudenme.