Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Minarini

[Resolvido] como fazer o menu em jquery ja nascer expandido

Recommended Posts

ola pessoal tenho um menu em jquery ta funcionando beleza. funciona assim: tenho uma tabela de menus e submenus. se um menu tiver submenus então criara o submenu, na verdade é montado um html com as ul e li e depois atribuido a uma Div. ta funcionando beleza o proble é que eu tenho na tabela de menu um campo que é expandido char de 1 exemplo

 

cod descricao expandido

1 - Cadastro de Produtos - S

2 - Cadastro de Cliente - N

 

posi então como fazer la no jquery que ao nascer o menu ele expanda o de produto e mantenha fechado o de cliente

 

veja meus codigos

 

function efeitoMenu(){	
	$(document).ready(function(){		
		$('#corpo_esquerda_menu').find('ul:eq(0)> li > a').click(function(){
			//verifica se o elemento está escondido
			if ($(this).parent().find('ul:eq(0):first').is(":hidden")) {				
				//se sim, mostra o elemento				
				$(this).parent().find('ul:eq(0)').slideDown(500);//adicionando o efeito ao elemento ul que está dentro da mesma li do link que foi clicado
			// Start animation
			} else {//se não, esconde o elemento.				
				$(this).parent().find('ul:eq(0)').slideUp(500);
			}
		});
		//fazer com que elementos do menu atribuido verifica se na banco ele venha
		//nascer expandido ou hidden de acordo com o que tiver no banco
		
	});

	função monta html(){
	   ....
	   ... 
	 ....
	  dwr.util.setValue('menu',menuMontado,{//atribui ao div de menu os componentes
			escapeHtml:false//diz para o dwr que ira codigos html
		});
		efeitoMenu();//função para dar animação no menu em jquery
	}
}


css//////////////////

#corpo_esquerda_menu{
	text-align:left;
	padding-left:20px;
	width: 170px;
	margin-top:15px;
	background: #FFFFFF;
	font-weight:bold;
	border-left: 10px solid #ECF0F3;
}

/*Formatando todos o links do menu*/
#corpo_esquerda_menu a{
	text-decoration:none;
	display:block;
	margin-bottom:5px;
	margin-top :5px;
}
/*Hovers*/
#corpo_esquerda_menu a:hover{
	text-decoration:none;
	color:silver;
}
/*Listas Pai*/
#corpo_esquerda_menu ul{
	list-style-position: outside;
	text-transform: none;
	text-decoration: none;
	font: bold 13px arial, helvetica, sans-serif;
}
/*Links Pai*/
#corpo_esquerda_menu ul a{
	background: #FFFFFF;
	color:#3A3555;
	border-top:1px solid #ECF0F3;
	list-style-image: url(../images/setaMenu.gif);
}
/*Listas Filhos*/
#corpo_esquerda_menu ul ul{
	display:none;
	margin-top:5px;
}
/*Links Filho*/
#corpo_esquerda_menu ul ul a{
	background-color:#FFFFFF;
	color:#3A3555;
	margin-left:15px;
	list-style-image: url(../images/setaMenuNegra.gif);
}

Compartilhar este post


Link para o post
Compartilhar em outros sites

jQuery é FW de Javascript.. vou mover para o fórum adequado.

Tópico Movido: Webstandards: CSS / XML / XHTML / HTML http://forum.imasters.com.br/public/style_emoticons/default/seta.gif Javascript/DHTML

Compartilhar este post


Link para o post
Compartilhar em outros sites

dei uma lida rapida, mas veja se colocando:

 

<script>
monta html();
</script>

após o menu, resolve... qq coisa, posta ai =]

Compartilhar este post


Link para o post
Compartilhar em outros sites

poste tb o html fica mais facil

 

acho que e esta linha que pode modificar mas sem ver o html fica dificil

 

 

$(this).parent().find('ul:eq(0)').slideDown(500);

Compartilhar este post


Link para o post
Compartilhar em outros sites

este codigo monta o menu vindo do banco usando java e dwr

 

function carregaMenu(){
	var menuMontado = '';//prepara uma variavel global que será o conteudo hmtl montado abaixo
	JSMenu.list(function(results){//executa em java e retorna os menus
		menuMontado = menuMontado + '<ul>';//começa uma lista
		for(var i=0; i < results.length;i++){//criará listas de numero igual ao do banco
			var regitroOrdenado = retornaMenuIndexado(results,i + 1);//retorna apartir de uma lista a ordem certa informada em cada registro no banco
			var temSubMenus = (regitroOrdenado.itensMenu.length > 0);						
			if (!temSubMenus) {//se não houver submenus monta uma lista normalmente
				menuMontado = menuMontado + '<li><a href="java script:renderInformacao('+ regitroOrdenado.idInformacao.idInformacao+')">'+regitroOrdenado.descricao+'</a></li>';
			} else {//se houver submenus
				menuMontado = menuMontado + '<li><a href="#">'+regitroOrdenado.descricao+'</a>';//cria a lista
				menuMontado = menuMontado + '<ul>';//prepara para criar sub lista
				for(var j=0; j < regitroOrdenado.itensMenu.length;j++){
					var subRegitroOrdenado = retornaMenuIndexado(regitroOrdenado.itensMenu,j + 1);
					menuMontado = menuMontado + '<li><a href="java script:renderInformacao('+ subRegitroOrdenado.idInformacao.idInformacao+')">'+subRegitroOrdenado.descricao+'</a></li>';//joga as listas dentro do submenu
				}
				menuMontado = menuMontado + '</ul>';//fecha sublista
				menuMontado = menuMontado + '</li>';//fecha lista pai criada
			}
		}
		menuMontado = menuMontado + '</ul>';//fecha menu geral
		dwr.util.setValue('corpo_esquerda_menu',menuMontado,{//atribui ao div de menu os componentes
			escapeHtml:false//diz para o dwr que ira codigos html
		});
		//apos carregar o menu fara executará os métodos abaixo
		efeitoMenu();//função criada acima que anima o menu que esta usando JQuery  
	});
}

apreveitando traduz essa linha pra mim literalmente. não consigo pegar a logica do jquery.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.