0

Separei meu site por sessões:

<section id="parte1"></section>
<section id="parte2"></section>
<section id="parte3"></section>

E gostaria de aplicar um efeito quando eu scrollar o mouse, tipo assim http://tympanus.net/codrops/2013/07/02/loading-effects-for-grid-items-with-css-animations/

Meu layout é um pouco diferente do deste demo do plugin, pois não tenho imagens conforme está ali.

Eu teria que colocar as <section> dentro dos li? Conforme exemplo do plugin:

<ul class="grid effect-4" id="grid">
    <li><a href="http://drbl.in/fWMM"><img src="images/1.jpg"></a></li>
    <li><a href="http://drbl.in/fWPV"><img src="images/2.jpg"></a></li>
    <li><a href="http://drbl.in/fWMT"><img src="images/3.jpg"></a></li>
    <li><a href="http://drbl.in/fQdt"><img src="images/4.png"></a></li>
    <!-- ... -->
</ul>
6
  • Filipe votei para fechar por questão de organização pois acho que a pergunta a que referí resolve o teu problema. Assim precisas só de ajustar o código que lá está na resposta. Se criares um jsFiddle posso ajudar a afinar.
    – Sergio
    Commented 12/01/2015 às 19:12
  • esta aqui: codepen.io/claviska/pen/cybdG Commented 12/01/2015 às 19:13
  • @Sergio ficou um tanto complicado vendo a sua explicação Commented 12/01/2015 às 19:25
  • @FelipeStoker viste o jsFiddle na resposta? consegues adaptar para o teu caso?
    – Sergio
    Commented 12/01/2015 às 19:29
  • 1
    @FelipeStoker coloca o teu HTML. Se não conseguires pôr a funcionar com o teu HTML e adaptando o meu JS/jQuery coloca aqui que ajudo. Mas tens de colocar o teu HTML e tentar...
    – Sergio
    Commented 12/01/2015 às 19:34

0

Pesquise outras perguntas com a tag .