Foros del Web » Creando para Internet » Diseño web »

Menu activo

Estas en el tema de Menu activo en el foro de Diseño web en Foros del Web. Hola estoy desarrollando un menu con jquery en el que al pasar el mouse hace un mouseover con efecto fade. El caso es que cuando ...
  #1 (permalink)  
Antiguo 13/11/2011, 06:27
 
Fecha de Ingreso: noviembre-2011
Mensajes: 1
Antigüedad: 12 años, 5 meses
Puntos: 0
Información Menu activo

Hola estoy desarrollando un menu con jquery en el que al pasar el mouse hace un mouseover con efecto fade. El caso es que cuando carga la página el estado activo del menu desaparece al posicionar el mouse encima y incluso en firefox o chrome no funciona bien el estado activo al clikear más de una vez este no se carga.Este es el código para el menu superior y el inferior

<ul id="topnav">
<li class="empresa"><a href="empresa.php" class="fade" id="linkOver">empresa</a></li>
<li class="services"><a href="e-catalogo.php" class="fade" id="linkOver">e-catálogo</a></li>
<li class="portfolio"><a href="galeria.php" class="fade" id="linkOver">galería</a></li>
</ul>
.....
<ul id="bottom_nav">
<li class="contact"><a href="donde_estamos.php" class="fade" id="linkOver">¿dónde estamos?</a></li>
<li class="contact"><a href="contact.php" class="fade" id="linkOver">contacto</a></li>
<li class="blog"><a href="links.php" class="fade" id="linkOver">links</a></li>
</ul>

Javascript:

<script type="text/javascript" src="../js/jquery-1.2.6.js"></script>
<script type="text/javascript" src="../js/jquery.dwFadingLinks.js"></script>

/*Este es el código de dwFadingLinks.js:
jQuery.fn.dwFadingLinks = function(settings) {
settings = jQuery.extend({
color: '#ff8c00',
duration: 500
}, settings);
return this.each(function() {
var original = $(this).css('color');
$(this).mouseover(function() { $(this).animate({ color: settings.color },settings.duration); });
$(this).mouseout(function() { $(this).animate({ color: original },settings.duration); });
});
};

*/
<script type="text/javascript" src="../js/jquery.effects.core_1.js"></script>

<script type="text/javascript">
$(document).ready(function() {
$('.fade').dwFadingLinks({
color: '#000',
duration: 700
});
});
</script>
<script language="javascript" type="text/javascript">
function setActive() {
aObj = document.getElementById('topnav').getElementsByTag Name('a');
for(i=0;i<aObj.length;i++) {
if(document.location.href.indexOf(aObj[i].href)>=0) {
aObj[i].className='active';
}
}
}
function setActive2() {
aObj = document.getElementById('bottom_nav').getElementsB yTagName('a');
for(i=0;i<aObj.length;i++) {
if(document.location.href.indexOf(aObj[i].href)>=0) {
aObj[i].className='active';
}
}
}
window.onload = function() {
setActive();
setActive2();
}
</script>
Una ayuda porfavor
Gracias de antemano
Gabi

Etiquetas: ajax, javascript
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 02:31.