"Abrir" um menu superior parecido com flash, mas não é.

[LineLica 0]

Gente, clique no "clique aqui" deste site:

 

http://www.fluorescente.org/

 

alguém sabe fazer isso?

sei que é com java + css... mas ainda tenho dúvidas...

[vagner.net 0]

Isso é Javascript/DHTML/CSS sim.Pega o código da página e baixa os arquivos .JS e .CSS, ou então utiliza a extensão FireBug do FireFox, assim você pode estudar como eles desenvolveram.Começa com alguns testes simples, com uma DIV flutuante você consegue esse efeito.Qq dúvida postae.OK..!!?? T+...

[Bonieky 0]

Dá pra fazer issu fácilmente usando um Framework do JavaScript, o Jquery.

[LineLica 0]

Isso é Javascript/DHTML/CSS sim.

Pega o código da página e baixa os arquivos .JS e .CSS, ou então utiliza a extensão FireBug do FireFox, assim você pode estudar como eles desenvolveram.

 

Começa com alguns testes simples, com uma DIV flutuante você consegue esse efeito.

 

Qq dúvida postae.

 

OK..!!?? T+...

então...

eu fui lá...

começei a fazer e tudo mais...

peguei os seguintes códigos:

 

JAVASCRIPT (comentários em português by mim. :P

//NAVEGAÇÃO - CÓDIGOS..........var opened=false;window.onload = function() {		resizeDivHeight = new fx.Height('navegation',{duration:2000});};function toggelopen(){	if(opened==false){		resizeDivHeight.custom(0,400);//O primeiro número é do Height inicial, o segundo do Height final.		opened=true;	}else{		resizeDivHeight.custom(400,0);//o primeiro númeor é do Height inicial, o segundo do Height final.		opened=false;	}}

e um estilinho css das classes citadas, tanto no html quanto no java:

#js {text-indent: -9999px;width: 140px;margin: 0 auto;text-align: center;}#navigation {font-size: 11px;background: #363636;border: 1px solid #363636;height:0px;padding: 0;color: #999999;overflow: hidden;}#navigation ul {padding: 0;margin: 0;list-style-type: none;margin-top: 10px;}#navigation ul li {padding: 0;margin: 0;}#navigation ul li a {border-bottom: 1px solid #444444;display: block;text-decoration: none;padding: 0;margin: 0;height: 20px;}#navigation-container {width: 800px;text-align: left;margin: 0 auto;padding: 0;padding-bottom: 10px;overflow: hidden;height: 370px;}#navigation-container a {color: #97AF6A;}#navigation-container a:hover {color: #D27C9E;}#navigation-container h3 {text-transform: none;margin: 0;padding: 0;margin-bottom: 5px;margin-top: 20px;padding-bottom: 1px;color: #91BFCE;font-size: 11px;background: transparent url(http://www.fluorescente.org/wp-content/themes/merdeka/images/h3.gif) repeat-x bottom left;}a#toggle {display: block;width: 140px;height: 39px;background: transparent url(http://www.fluorescente.org/wp-content/themes/merdekaimages/toggle2.gif) no-repeat top left;}a:hover#toggle {background-position: 0 -39px;}

e a parte do html é assim:

<div id="navigation"><div id="navigation-container">(...)Qualquer coisa aqui (parte do menu)</div></div><div id="js"><a id="toggle" href="#" onclick="toggelopen()" title="Clique para abrir" >Click here</a></div><div id="container"><div id="header"><a href="http://www.fluorescente.org" ><img src="http://i22.photobucket.com/albums/b313/quekkel/top.jpg" alt="home" style="border: 0px; margin: 0px; padding: 0px;"></a></div>

e fiz o seguinte:

<div id="navigation">      <div id="navigation-container">	  here here here<br />s2	  </div></div><div id="js"><a id="toggle" href="#" onclick="toggelopen()">Click here</a></div>something here...... just for test it!

[LineLica 0]

http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

 

http://moofx.mad4milk.net/

 

http://mootools.net/download

 

bjus.;

 

;)

 

[edited]

 

mais um para dar um gostinho para vcs!

(Demonstrações)

 

http://demos.mootools.net/

 

 

e ainda, o fórum onde eles incrementam mais ainda esta ferramenta:

http://forum.mootools.net/

[/edited]