Problemas com menu Drop Down

[nikeweiand 1]

Bom dia.

 

Estou desenvolvendo um site no qual a um menu no topo que estou tentando por drop down... Porem da maneira na qual a minha estrutura esta montada não esta chegando ao resultado esperado, o mesmo não consegue identificar a largura da table dentro de ul li, como segue o exemplo do treixo abaixo:

 

<ul>
<li>
	<ul>
		<li>
			<table>
				<tr>
					<td></td>
					<td></td>
					<td></td>
				<tr>
				<tr>
					<td></td>
					<td></td>
					<td></td>
				<tr>
			</table
		</li>
	</ul>
</li>
</ul>

 

Chamada do menu:

$("#menu ul li").hover(function(){		
$(this).find("ul").slideDown("slow");
}, function(){
$(this).find("ul").slideUp("slow");
});

 

PS: O efeito slideDown funciona perfeitamente porem é como se ele achasse que só existisse o próximo "li" e não a table dentro dela.

Já tentei definir os tamanhos na table, na css e nada... Não sei se fui bem claro mas alguem tem alguma dica?

[William Bruno 1501]

Bom Dia amigo,

 

você realmente precisa dessa tabela ai ?

Qual elemento tem o id="menu" ?

 

 

 

Poste um link, pois o teu css pode estar interferindo.

[nikeweiand 1]

Ola William Bruno,

 

Desculpe esqueci de citar no exemplo que coloquei a div do menu, mas seria isso conforme abaixo:

 

<div id="menu">
<ul>
       <li>
               <ul>
                       <li>
                               <table>
                                       <tr>
                                               <td></td>
                                               <td></td>
                                               <td></td>
                                       <tr>
                                       <tr>
                                               <td></td>
                                               <td></td>
                                               <td></td>
                                       <tr>
                               </table>
                       </li>
               </ul>
       </li>
</ul>
</div>

 

Pior que necessito, pois pretendo fazer como este site aqui:

 

 

 

Então usando table ficaria mais facil depois de no php pegar os topicos para listar da area...

[William Bruno 1501]

não.. na verdade com table fica mais dificil...

 

é bem mais simples tanto pro php qnto pro client side, se você não usar table para isso.

você notou que tá faltando o > no </table> ?

 

                                        <tr>
                               </table
                       </li>

 

desnecessária a tua DIV, poderia jogar o ID direto na UL

[nikeweiand 1]

hummm, vlw as dicas!

 

Você intendeu onde quero chegar certo? tens uma ideia para me dar sem o uso de "table" para chegar naquele resultado como da imagem?

 

Sobre o "</table>", foi apenas um erro de digitação quando postei aqui, no codigo esta correto

[Valdeir Info 2]

hummm, vlw as dicas!

 

Você intendeu onde quero chegar certo? tens uma ideia para me dar sem o uso de "table" para chegar naquele resultado como da imagem?

 

Sobre o "</table>", foi apenas um erro de digitação quando postei aqui, no codigo esta correto

 

use DIV no lugar de tabelas, e aplique um css para ficar uma ao lado da outra ex:

 

#menu li div {
  height:100px;
  float:left;
  width:200px;
}

[nikeweiand 1]

boaa Valdeir Info.

 

Nemm me liguei em usar desta forma tbm, vou tentar aqui... em breve posto resultado ;D

[nikeweiand 1]

Ok, alterei..

 

Porem continuo com problemas :S

 

HTML:

<ul id="menu">
<li>teste
	<div class="exemplo">
		teste teste teste
	</div>
</li>
</ul>

 

Porem como neste exemplo acima, meu conteúdo de dentro da "li .exemplo" é maior que o nome "teste" (largura da "li") ai o que acontece é que o conteúdo de dentro da class "exemplo" da quebra de linha, sendo que não posso deixar fixo largura e altura da mesma pois "li .exemplo" terá conteúdo variante.

 

Dicas?

[Valdeir Info 2]

Ok, alterei..

 

Porem continuo com problemas :S

 

HTML:

<ul id="menu">
<li>teste
	<div class="exemplo">
		teste teste teste
	</div>
</li>
</ul>

 

Porem como neste exemplo acima, meu conteúdo de dentro da "li .exemplo" é maior que o nome "teste" (largura da "li") ai o que acontece é que o conteúdo de dentro da class "exemplo" da quebra de linha, sendo que não posso deixar fixo largura e altura da mesma pois "li .exemplo" terá conteúdo variante.

 

Dicas?

 

 

não sei se vai dá certo, porque não tem como testar aqui agora. Mais tente colocar no css um position:relative; em #menu li e um position:absolute; em #menu li .exemplo

[FernandoPhP 9]

Veja esse post, pode ser o que você tá precisando, tem o script para fazer os menu e tem os arquivos em anexo, só baixar.

Link não autorizado removido

Espero ter ajudado