Aprenda como se faz:..." Up" e " Down" , com efeito deslizante nos novos modelos

"  Up"    e "   Down"    , com efeito deslizante nos novos modelos

"  Algum tempo atrás nós visto em um post anteriorTal como colocar setas no blog para ir para cima dela e ir ao fundo, com um efeito suave deslizamento, utilizando Scriptaculous."

"   Neste post vamos ver como fazer os mesmos modelos Designer Novo."
[1] De Edição de HTML do nosso painel do rótulo localizar Blogger </head> ; no código do seu template e cole-o no seguinte:

<!-- Prototype y Scriptaculous-->
<script src='http://www.google.com/jsapi'/><script>
google.load("prototype","1.6.0.3");
google.load("scriptaculous", "1.8.2");
</script>
<!-- Prototype y Scriptaculous-->

Nota:

Lembre-se que se você já estiver usando este código (Scriptaculous) para qualquer outra finalidade, não é necessário colocá-la de volta.
E lembre-se também que se você usar JQuery no modelo, você não pode usar Scriptaculous ao mesmo tempo.

[2] Quase no final do código do nosso pessoal localize 
a tag </body>; e sobre ela  

coloque o código para visualizar as fotos ou as setas para "  subir"   e "  descer"

<!--Flecha ir abajo -->
<a href='#footer-wrapper' onclick='new Effect.ScrollTo("footer-wrapper",{offset:-140}); return false'><img alt='Ir abajo' border='0' src='URL_DE_LA_IMAGEN_FLECHITA' style='position:fixed; bottom:40px; right:0;margin-bottom: 5px;'/></a>

<!--Flecha ir arriba -->
<a href='#outer-wrapper' onclick='new Effect.ScrollTo("outer-wrapper",{offset:-140}); return false'><img alt='Ir arriba' border='0' src='URL_DE_LA_IMAGEN_FLECHITA' style='position:fixed; bottom:0; right:0;margin-top: 5px;'/></a>

[3] Alterar onde se diz URL_DE_LA_IMAGEN_FLECHITA A URL de suas imagens ou ícones de seta.

[4] Vamos agora localizar o modelo que esta linha de código:

<div class='body-fauxcolumns'>

E mudar isso para:

<div id='outer-wrapper' class='body-fauxcolumns'>

[5] Temos agora de encontrar esta linha de código:

<div class='content-cap-bottom cap-bottom'>

E mudar isso para:

<div id='footer-wrapper' class='content-cap-bottom cap-bottom'>

[6] Salve as alterações.

fonte e créditos deste presente post:

http://elescaparatederosa.blogspot.com

 :::