Conflicto entre lightbox y menu

bLaCkH0Le

Hola a todos. Tengo un problema con el popup lightbox y mi menu y es que ambos me usan el atributo rel de los vinculos. En el menu utilizo lo siguiente:

$(function(){
	$("a.hover_all").show("fast", function() {
		var clase = $(this).attr('class');
		$(this).wrap("<div class=""+clase+""> ");
		$(this).attr("class", "");
	});
		
//display the hover div
$(".hover_all").show("fast", function() {
	//append the background div
	$(this).append("<div></div>");
	
	//get link's size
	var wid = $(this).children("a").width();
	var hei = $(this).children("a").height();
	
	//set div's size
	$(this).width(wid);
	$(this).height(hei);
	$(this).children("div").width(wid);
	$(this).children("div").height(hei);
	
	//on link hover
	$(this).children("a").hover(function(){
		//store initial link colour
		if ($(this).attr("rel") == "") {
			$(this).attr("rel", $(this).css("color"));
		}
		//fade in the background
		$(this).parent().children("div")
			.stop()
			.css({"display": "none", "opacity": "1"})
			.fadeIn("fast");
		//fade the colour
		$(this)	.stop()
			.css({"color": $(this).attr("rel")})
			.animate({"color": hoverColour}, 350);
	},function(){
		//fade out the background
		$(this).parent().children("div")
			.stop()
			.fadeOut("slow");
		//fade the colour
		$(this)	.stop()
			.animate({"color": $(this).attr("rel")}, 250);
	});
});
});

Me gustaria saber si puedo acotar para que este codigo actue sólo en los rel de un div determinado y asi no joderme el lightbox.

l31m

Ponle un ID al DIV del menú (p.e. menu) y en el codigo haces referencia a él de la siguiente manera:

En lugar de:
$(this).attr( "rel" )

pones:
$( "menu" ).attr( "rel" )

así sabrá que te refieres al atributo rel del elemento menu y no al del lightbox.

Creo que así debería funcionar...

bLaCkH0Le

hola l3im! gracias por tu ayuda. Meti el menu en un div y le cambie las refrencias como me dijistes pero me sigue dando el mismo problema.

Depende de si llame antes a la carga de lightbox o a la del menu funciona uno u otro:

<script src="js/efectomenu.js" type="text/javascript"></script>

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

Ambos se joden el uno al otro dependiendo de quien cargue el ultimo : S

El menu es este:

                <div id="menu">
                <ul class="nav">
                <li id="principal"><a class="hover_principal hover_all" href="index.php"> <span>PRINCIPAL</span></a></li>
                <li id="empresa"><a class="hover_empresa hover_all" href="empresa.php"><span>EMPRESA</span></a></li>
                <li id="servicios"><a class="hover_servicios hover_all" href="servicios.php"><span>SERVICIOS</span></a></li>
                <li id="excursiones"><a class="hover_excursiones hover_all" href="excursiones.php"><span>EXCURSIONES</span></a></li>
                <li id="clientes"><a class="hover_clientes hover_all" href="clientes.php"><span>CLIENTES</span></a></li>
				<li id="contactos"><a class="hover_contacto hover_all" href="contacto.php"><span>CONTACTO</span></a></li>
                </ul>
                </div>
9 días después
bLaCkH0Le

alguien me puede echar una mano¿?

Usuarios habituales

  • bLaCkH0Le
  • l31m