Locaweb - Edição 55

56 / 68

56
DICAS PARA PROGRAMAR DE UMA
MANEIRA FÁCIL E DESCOMPLICADA
CODE/
SCROLL
MAGIC
120
MINUTOS
CONHECI-
MENTOS DE
JAVASCRIPT
INTER-
MEDIÁRIO
PD GDV D©·HV
mais comuns para
um usuário web
é a rolagem de
página, scroll, para acessar
outras partes da tela,
LQIRUPD©·HV LPDJHQV $
biblioteca javascritp Scroll
Magic aproveita esse evento
para criar dinamismo,
interatividade e surpresas
para o usuário.
Além disso, uma das coisas que
melhoram o ranqueamento de um
site emmecanismos de pesquisa,
como o Google, é justamente o
tempo que um visitante permanece
nele. Um site atraente, responsivo,
interativo e dinâmico é uma das
melhores formas de garantir o
PDLRU WHPSR H D PHOKRU H[SHUL¬QFLD
possíveis ao visitante.
Para começar a instalação,
é preciso fazer o download do
arquivo zipado do site
descompactar
H EDL[DU HP XP GLUHWµULR QR
servidor do site. Pode ser o
WUDGLFLRQDO MV RX XP HVSHF¯íFR
para a biblioteca, /scrollmagic.
É preciso lembrar sempre de
referenciar corretamente os
gsap/TweenMax.min.js"></
script>
<script src="path/to/js/
jquery.min.js"></script>
<script src="path/to/js/
jquery.scrollmagic.js"></
script>
<!-- Remover depois que
finalizar o desenvolvimento
-->
<script src="path/to/js/
jquery.scrollmagic.debug.
js"></script>
<script>
// Código Scroll Magic
</script>
Essas linhas podem ser
inseridas no HEAD ou logo acima
do fechamento da tag “body”
ERG\! 8PD GHODV « DX[LOLDU
de desenvolvimento e deve ser
H[FOX¯GD GHSRLV GD S£JLQD SURQWD R
arquivo “debug”.
Isso basta para acessar os
recursos da biblioteca nas páginas
U
Um dos trunfos
do Scroll Magic
é deixar o
visitante mais
tempo nas páginas
eletrônicas
Tudo o que você
precisa para
trabalhar com a
biblioteca está no
site scrollmagic.io
SCROLL COMTUDO
Use a biblioteca Javascript Scroll Magic e aproveite esse evento para
criar dinamismo, interatividade e surpresas para o usuário Por Homero Ottoni
arquivos e caminhos nas páginas.
A instalação é idêntica a de
qualquer biblioteca javascript:
<script src="js/scrollmagic/
uncompressed/ScrollMagic.
js"></script>
Para ter as funcionalidades
da biblioteca, é preciso ainda dois
complementos: o sempre presente
jQuery e um pacote chamado GSAP,
DUTXLYR 7ZHHQ0D[ 2 FDEH©DOKR GD
S£JLQD íFDU£ DVVLP
<script src="path/to/js/
REVISTA LOCAWEB