[SOLUCIONADO] cambiar de hover a click

[esystemas]

Buenas me explico tengo un menu y "cuando me ubico sobre un item" me muestra los submenus respectivos ejemlo
<ul>
<li>
<a href="pagina1.html"> padre</a>
<ul><li><a href="pagina2.html">hijo</a></li></ul>
</li>

como podría hacer para funcione asi cuando hago clik en li me mustre los ul hijos , yo cambie el hover del jquery por clik pero cuando hago clik defrente se va a pagina1.html

aqui el codigo :


linea original sin tocar ----------> $("ul.bzMenuStyle li").hover(function(){






codigo

jQuery(document).ready(function($){
$("ul.bzMenuStyle>li").filter(":first").addClass(" first");
$("ul.bzMenuStyle>li").filter(":last").addClass("l ast");
$("ul.bzMenuStyle li.active>a").addClass("active");
$("ul.bzMenuStyle li.parent>a").addClass("parent");
$("ul.bzMenuStyle li.active").each(function(){
$(this).children("ul").show();
});
linea pero con click en lugar de hover

$("ul.bzMenuStyle li").click(function(){
$(this).children("ul").show();
$(this).siblings().children("ul").hide();
}, function(){
if(!$(this).hasClass("active"))$(this).children("u l").hide();
$(this).siblings(".active").children("ul").show();
});

});






otra parte del codigo sin tocar talves este alli el truco

jQuery(document).ready(function($){
$("ul.bzMenuStyle>li").filter(":first").addClass(" first");
$("ul.bzMenuStyle>li").filter(":last").addClass("l ast");

$("ul.bzMenuStyle li").hover(function(){
$(this).children("a").addClass("hover");
}, function(){
$(this).children("a").removeClass("hover");
});
$("ul.bzMenuStyle li.active>a").addClass("active");
$("ul.bzMenuStyle ul li.parent").hover(function(){
$(this).children("ul").show("fast");
}, function(){
$(this).children("ul").stop(1,1).hide("fast");
});
$("ul.bzMenuStyle li.parent:not(ul.bzMenuStyle ul li.parent)").hover(function(){
$(this).children("ul").slideDown("fast");
}, function(){
$(this).children("ul").stop(1,1).slideUp("fast");
});

subMenuWidth = parseFloat($("input#bzMenuStylesWidth").val());
topMenuHeight = 30;//$("ul.bzMenuStyle>li").height();

$("ul.bzMenuStyle li.parent ul").css("width", subMenuWidth+"px");
$("ul.bzMenuStyle li.parent ul ul").css("left", subMenuWidth+"px");
$("ul.bzMenuStyle>li>ul").css("top", topMenuHeight);
$("ul.bzMenuStyle li.parent li.parent").hover(function(){
myO = $(this).offset();
winW = $(window).width();
if(myO.left+(subMenuWidth*2)>winW){
$(this).find("ul").css("left", "-"+subMenuWidth+"px").addClass("offBoundary");
};
});
});

[fhederico]

Hola,

Cuando haces click en un link, por defecto te redirecciona a este, lo que debes hacer es cancelar esto agregando lo siguiente

Código:

$("ul.bzMenuStyle li").click(function(event){
event.preventDefault();  

Con esto no te redireccionara al link al hacer click, y lo otro ocupa tag para tu codigo, asi se ve mas ordenado y se entiende mas, es decir, pone estas etiquetas al inicio y al final de tu codigo

Código HTML:

[CODE] TODO TU CODIGO [/CODE]
 

Saludos

[esystemas]

debe faltar algo mas

jQuery(document).ready(function($){
$("ul.bzMenuStyle>li").filter(":first").addClass(" first");
$("ul.bzMenuStyle>li").filter(":last").addClass("l ast");
$("ul.bzMenuStyle li.active>a").addClass("active");
$("ul.bzMenuStyle li.parent>a").addClass("parent");
$("ul.bzMenuStyle li.active").each(function(){
$(this).children("ul").show();
});
$("ul.bzMenuStyle li").click(function(e){
e.preventDefault();
$(this).children("ul").show();
$(this).siblings().children("ul").hide();
}, function(){
if(!$(this).hasClass("active"))$(this).children("u l").hide();
$(this).siblings(".active").children("ul").show();
});
});

[fhederico]

Puedes pegar el HTML donde estan los li y todo eso, para hacer pruebas.

Saludos

[pzin]

Y usa highlight o code para cuando publicas código, y ya si lo pones con indentación mejor.

[esystemas]

Mejor pego el link para que lo vean funcionando

http://addonstreet.com/demo/menu-sty...7/level-2-item



ajala alguien pueda orientarme para que en lugar de hover funione con clik ala hora de desplegar los items del sub menu

gracias de ante mano

[fhederico]

Mmmmm...

Pagaste por eso ya? xD

Bueno, sobre tu duda, prueba reemplazando esto

Código:

$("ul.bzMenuStyle li").click(function(e){
			$(this).children("ul").show();
			$(this).siblings().children("ul").hide();
		}, function(){
			if(!$(this).hasClass("active"))$(this).children("ul").hide();
			$(this).siblings(".active").children("ul").show();
		});

Por esto

Código:

$("ul.bzMenuStyle li").click(function(e){
			e.preventDefault();	
			
			$(this).children("ul").show();
			$(this).siblings().children("ul").hide();
		});

Saludos

[esystemas]

Excelente eso era muchisimas gracias por tips

[esystemas]

Iniciado por esystemas

Excelente eso era muchisimas gracias por tips

disculpa amigo que insista esta bien si se despliega ahora los sub items , hasta alli bien , pero se podra una ves que este desplegados que los vinculos funionen?