Tengo una web con un menú que hace una transition de izquierda a derecha onmouseover, lo que quiero conseguir es que, por defecto, me muestre el primer elemento del menú siempre visible, pero no encuentro la forma de hacerlo..
Os paso el HTML5 y el css que utilizo haber si alguien consigue comentarme algo!
Es una parte del HTML5, pero suficiente para lo que busco hacer :S
HTML5
Código:
Básicamente, añado el menú principal y después por mediación de los ul y li creo la lista formateada con el css.<!doctype html> <html lang="es"> <head> <meta charset="utf-8"> <!-- http-equiv="Content-Type" content="text/html" --> <title>IMAN</title> <link rel="stylesheet" href="styles.css" type="text/css" media="screen" /> <link rel="stylesheet" href="print.css" type="text/css" media="print" /> <script src="js/funciones.js"></script> <script src="js/jquery-1.6.2.js" type="text/javascript"></script> <script src="js/jquery-1.6.2.min.js" type="text/javascript"></script> <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--> </head> <body> <div id="wrapper"><!-- #wrapper --> <nav><!-- top nav --> <div class="menu" id="div_menu"> <ul> <li><a href="#" onClick="habilita_div(div_Inicio)" id="menu_inicio">Inicio</a></li> <li><a href="#" onClick ="habilita_div(div_Memoria)" id="menu_mem">Objetivos</a></li> <li><a href="#" onClick ="habilita_div(div_Consorcio)" id="menu_conso">Consorcio</a></li> <li><a href="#" onClick ="habilita_div(div_Noticias)" id="menu_noti">Noticias</a></li> <li><a href="#" onClick ="habilita_div(div_Resultados)" id="menu_res">Resultados</a></li> <li><a href="#" onClick ="habilita_div(div_Contacto)" id="menu_cont">Contactos</a></li> <!-- <li><a href="http://www.w3.org/" id="w3c"><pre style='display:inline'> </pre> <img src="images/val_W3C.gif" style="margin-top:-15px" alt=""/></a></li> --> </ul> </div> </nav><!-- end of top nav --> <header><!-- header --> <h1 style="color:white; text-shadow:12px 12px 7px #000000;" >IMAN - Innovation MANager</h1> <h2 style="color:white; text-shadow:12px 12px 7px #000000;">Sistema global para la gestión de la I+D+i en una organización</h2> </header><!-- end of header --> <!-- Menú de "Inicio" --> <div id="div_Inicio" > <section id="main_ini"><!-- #main content area --> <section id="content_ini"><!-- #content --> <section class="accordbk"> <article class="horizontalaccordion"> <ul> <li id="inicio" style=""> <h3>Inicio</h3> <div style="height: 400px; width: 730px;"><img src="images/acc1.jpg" alt="" /><p><b>Descripción</b></p> <p></p> <br> <br> <br> <p>El objetivo general del proyecto es la construcción de una solución global para la Gestión de la I+D+i, la cual facilite la gestión de las actividades de innovación en una organización en línea con todas las áreas de la misma (utilizando el conocimiento existente y generando a su vez conocimiento utilizable por las distintas áreas y por la organización en su conjunto), y con la situación tecnológica y económica y organizacional exterior. Se pretende que la solución sea compatible con las principales normativas internacionales en el campo de la I+D+i (de las cuales se hablará más adelante en la memoria) existentes y las que están siendo definidas en la actualidad.</p> </div> </li> <li id="dat_interes"> <h3>Acerca de IMAN</h3> <div style="height: 400px; width: 730px;"><img src="images/acc1.jpg" alt="" /><p><b>Datos de Interés</b></p> <p></p> <br> <br><p></p> <p>La naturaleza de la aplicación IMAN la hace muy interesante para un amplio abanico de empresas, principalmente aquellas interesadas en la innovación en la mejora de sus procesos de negocio. La innovación es un aspecto muy importante en los tiempos que vivimos hoy en día, siendo la mejora y la creación de nuevos paquetes de productos dos factores imprescindibles y fundamentales para comenzar una nueva época de bonanza económica, donde reemplazar las antiguas costumbres del mercado.</p> </div> </li> </ul> </article> </section> <br> </section><!-- end of #content --> </section><!-- end of #main content --> </div> </div><!-- #wrapper --> </body> </html>
Muchas gracias!