Menú

Mostrar Mensajes

Esta sección te permite ver todos los mensajes escritos por este usuario. Ten en cuenta que sólo puedes ver los mensajes escritos en zonas a las que tienes acceso en este momento.

Mostrar Mensajes Menú

Temas - poncho_gc

#1
Desarrollo Web / En Que esta echo este menu...
28 Julio 2013, 22:06 PM
Saludos a todos los de este foro.
es mi primer post.
estoy buscando  de algun script o ejemplo que me ayudara a crear un mneu semejante o parecido a este menu de la pagina:
http://electricalsupport.com.mx/es/
podrin ayudarme por favor.
soy novato, tengo conocimientos basicos html.

podrian ayudarme por favor. yo hice sto pero no pude cambiarle  de color a cada menu y tampoco pude darle animacion.

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="Longer Link Text"><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>

codigo .css

   #tabsI {
 
  float:left;
    width:100%; 
   
    background:#FFFFFF;/* #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;
    }

el efecto es menu color naranja y al pasar el mouse cambia a azul. pero no es lo que busco.....

;DSaludos
Poncho Garcia