Hey, I won’t make a cool effect on my page, and I’m thinking, how about hiding everything on loading and showing each div with the effect one by one? if its a bad idea, can you help me with a better idea?
EDIt: Using the $ ("div") function. each () jQuery. EDIT2: Children from children.
EDIT3:
<div id="loader"><table cellpadding="0" cellspacing="0" width="100%" height="100%"><tr><td><img src='/assets/images/ajax-loader.gif' border=0 alt=""><br><br>A carregar, aguarde...</td></tr></table></div> <div class="wrapper" id="menu"> <div class="center_div"> <h1 class="logo"><a href="/pagprincipal" title="Microdual">Microdual</a></h1> <ul class="sf-menu"><li class="active"><a href="empresa/perfil" title="Empresa" ><span class="menuicon" id="empresa"></span>Empresa</a><ul><li class="active"><a href="/empresa/perfil" title="Perfil" >Perfil</a></li> <li><a href="/empresa/politica-qualidade" title="Política de Qualidade" >Política de Qualidade</a></li> <li><a href="/empresa/novidades" title="Novidades" >Novidades</a></li> <li><a href="/empresa/portfolio" title="Portfólio" >Portfólio</a></li> <li class="last"><a href="/empresa/contactos" title="Contactos" >Contactos</a></li> </ul></li> <li><a href="/produtos" title="Produtos" ><span class="menuicon" id="produtos"></span>Produtos</a><ul><li><a href="/produtos/alojamento-web" title="Alojamento Web" >Alojamento Web</a></li> </ul></li> <li><a href="/servicos" title="Serviços" ><span class="menuicon" id="servicos"></span>Serviços</a><ul><li><a href="/servicos/assistencia-tecnica" title="Assistência Técnica" >Assistência Técnica</a></li> </ul></li> <li class="last"><a href="/suporte" title="Suporte" ><span class="menuicon" id="suporte"></span>Suporte</a><ul><li><a href="/suporte/suporte-empresas" title="Suporte Técnico Empresas" >Suporte Empresas</a></li> <li><a href="/suporte/suporte-home" title="Suporte Técnico Home" >Suporte Home</a></li> <li><a href="/suporte/suporte-tecnico-web" title="Suporte Técnico Web" >Suporte Web</a></li> <li class="last"><a href="/suporte/area-de-downloads" title="Área de Downloads" >Área de Downloads</a></li> </ul></li> </ul> </div> </div> <div class="wrapper" id="header_page"> <div class="center_div"> <div id="right"> <p style="text-align: center;"><img src="assets/images/perfil-top.jpg" alt="" width="590" height="200" /></p> <h3>A Nossa Missão</h3> <p>A Microdual tem a missão de desenvolver soluções tecnológicas inovadoras, que permitam satisfazer todas as necessidades dos clientes, parceiros e empresas, através de produtos e serviços de elevada qualidade, que os tornam mais eficientes. </p> <h3>A Nossa Visão</h3> <p>Acreditamos que através da inovação tecnológica actual iremos encontrar as soluções necessárias para enfrentar os desafios do futuro. Da tecnologia advéma oportunidade para as empresas crescerem, para os cidadãos em mercados emergentes prosperarem entrando na Economia digital, e para as pessoas adaptarem novas possibilidades.</p> <h3>Os Nossos Valores</h3> <p>A nossa conduta deve refletir os mais altos padrões de ética;<br />A nossa comunicação deve ser clara e precisa;<br />O nosso gerenciamento deve ser em equipa, consistente e focado;<br />O nosso relacionamento com clientes e colaboradores deve ser transparente e baseado na responsabilidade e confiança entre as partes.</p> <ul class="post_list"> </ul> <h3>O Nossos Objetivo</h3> <p>Melhorar continuamente o que fazemos, para assim contribuir para o desenvolvimento sustentável, acrescentando vantagem competitiva.</p> </div> <div id="left"> <ul class="sf-submenu"><li class="active"><a href="/empresa/perfil" title="Perfil" >Perfil</a></li> <li><a href="/empresa/politica-qualidade" title="Política de Qualidade" >Política de Qualidade</a></li> <li><a href="/empresa/novidades" title="Novidades" >Novidades</a></li> <li><a href="/empresa/portfolio" title="Portfólio" >Portfólio</a></li> <li class="last"><a href="/empresa/contactos" title="Contactos" >Contactos</a></li> </ul> </div> </div> </div> <div class="wrapper" id="footer"> <div id="footer_contents"> <p>©Microdual 2010 - <a href="empresa/termos-e-condicoes-utilizacao" title="">Termos de Utilização</a> - <a href="empresa/politica-privacidade" title="">Privacidade</a> - <a href="empresa/compatibilidade-do-website" title="">Compatibilidade</a> - <a href="mapasite" title="">Mapa do Site</a> - <a href="empresa/contactos" title="">Contactos</a> |</p> <ul> <li><a href="#" title=""><img src="/assets/templates/default/img/network_icons/feed.gif" alt="Feed" /></a></li> <li><a href="#" title=""><img src="/assets/templates/default/img/network_icons/twitter.gif" alt="Twitter" /></a></li> <li><a href="#" title=""><img src="/assets/templates/default/img/network_icons/facebook.gif" alt="Facebook" /></a></li> </ul> <form action="" method="get"> <div> <input class="input_search" name="search_field" type="text"> <input value="Procurar" class="button_search" type="submit"> </div> </form> </div> </div>
thanks to all Jose Moreira
jquery effects
Cuss
source share