El tema es este. Tengo un Index.html en donde he colocado una barra de navegación horizontal, y que mediante una aplicación prefabricada llamada "Lavalamp" he animado con JS y JQuery, de forma que cuando el mouse se posiciona sobre cada uno de los vínculos hay un rectángulo naranja que pasa por detrás apuntando al botón que el usuario esta posando con el cursor.
El tema es que a pesar de que he colocado vínculos en los botones (que no son más que palabras con un rectpangulo detrás que se mueve), al hacer clic no los abre. Es como si fuera que los scripts no permitieran que se siga el hipervinculo cuando los usuario hacen clic en ellos.
El código completo de mi htm es el siguiente:
Código HTML:
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Documento sin título</title> <style type="text/css"> <!-- body { background-color: #333; background-image: url(imagenes/activos/bg.png); background-repeat: repeat-x; } --> </style> <link href="estilo_A.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" href="lavalamp_test.css" type="text/css" media="screen"> <script type="text/javascript" src="jquery-1.1.3.1.min.js"></script> <script type="text/javascript" src="jquery.easing.min.js"></script> <script type="text/javascript" src="jquery.lavalamp.min.js"></script> <script type="text/javascript"> $(function() { $("#1, #2, #3").lavaLamp({ fx: "backout", speed: 700, click: function(event, menuItem) { return false; } }); }); </script> </head> <body> <div id="contenidoTotal"> <div id="separadorIZQ"></div> <div id="cuadroDER"> <div id="header"><img src="imagenes/activos/header.png" width="759" height="112" alt="Bienvenido a Juarez Climatizaciones" /></div> <div id="navegacionBAR"> <ul class="lavaLampWithImage" id="1" name="navBArra"> <li><a href="i2.htm">Inicio</a></li> <li><a href="#">Servicios</a></li> <li><a href="#">Productos</a></li> <li><a href="#">Promociones especiales</a></li> <li><a href="#">¿Cómo llegar?</a></li> <li><a href="#">Contáctenos</a></li> </ul> </div> <div id="cuadroMaestro"> <div id="contenido"></div> <div id="preloader">Este es el preloader</div> </div> </div> </div> </body> </html>
Como verán ustedes, en el DIV "navegacionBAR" es donde coloco los elementos li y que tiene como clase asociada "lavaLampWithImage".
Todo funciona al pelo, menos el seguimiento de vínculos....... ¿Se les ocurre algo?
Después pretendo hacer que al cliquear se cargue contenido en una DIV llamada "contenidoCentraL" mediante AJAX, y me supongo que voy a tener los mismos conflictos. ¿Qué estoy haciendo mal?
Gracias de antemano.