Explicación del código por partes:
1. descargamos el archivo scriptaculous-js-1.8.1
2. alojamos los archivos "prototype.js", "scriptaculous.js", "builder.js", "effects.js", "dragdrop.js", "controls.js" y "slider.js"; por ejemplo en googlepages
3. en diseño/edición html buscamos </head> y justo antes pegamos el siguiente código:
<script type="text/javascript" src="URLdelfichero prototype.js"></script>
<script type="text/javascript" src="URLdelfichero scriptaculous.js?load=effects"></script>
Sustituimos lo que está destacado en blanco por la "ruta de enlace" de cada uno de esos archivos que tengamos en googlepages (botón secundario/copiar ruta de enlace)
4. ahora, cada vez que queramos emplear éste efecto pondremos el siguiente código:
<a href="#" onclick="Effect.toggle('nombreunico','blind'); return false">ver/ocultar (+/-)</a>texto
<div id="nombreunico" style="display: none;"><div>elementoaver/ocultar</div></div>
significando lo que está destacado en blanco:
nombreunico:aquí pondremos un nombre (único y exclusivo!!) el que queramos al elemento al que le aplicamos dicho efecto
ver/ocultar (+/-): texto o imagen en la que clicamos para expandir el elemento oculto
texto: si queremos poner un texto entre el enlace anterior y el elemento a expandir
elementoaver/ocultar:la foto/texto/vídeo o lo que queramos expandir
NOTA: hay 3 efectos, blind, appear y slide (a gusto del bloggeador).
Et voilá, ésto lo he adaptado a mis entendederas de la explicación que oloblogger hace del efecto.
1. descargamos el archivo scriptaculous-js-1.8.1
2. alojamos los archivos "prototype.js", "scriptaculous.js", "builder.js", "effects.js", "dragdrop.js", "controls.js" y "slider.js"; por ejemplo en googlepages
3. en diseño/edición html buscamos </head> y justo antes pegamos el siguiente código:
<script type="text/javascript" src="URLdelfichero prototype.js"></script>
<script type="text/javascript" src="URLdelfichero scriptaculous.js?load=effects"></script>
Sustituimos lo que está destacado en blanco por la "ruta de enlace" de cada uno de esos archivos que tengamos en googlepages (botón secundario/copiar ruta de enlace)
4. ahora, cada vez que queramos emplear éste efecto pondremos el siguiente código:
<a href="#" onclick="Effect.toggle('nombreunico','blind'); return false">ver/ocultar (+/-)</a>texto
<div id="nombreunico" style="display: none;"><div>elementoaver/ocultar</div></div>
significando lo que está destacado en blanco:
nombreunico:aquí pondremos un nombre (único y exclusivo!!) el que queramos al elemento al que le aplicamos dicho efecto
ver/ocultar (+/-): texto o imagen en la que clicamos para expandir el elemento oculto
texto: si queremos poner un texto entre el enlace anterior y el elemento a expandir
elementoaver/ocultar:la foto/texto/vídeo o lo que queramos expandir
NOTA: hay 3 efectos, blind, appear y slide (a gusto del bloggeador).
Et voilá, ésto lo he adaptado a mis entendederas de la explicación que oloblogger hace del efecto.
3 comentarios:
Muchas gracias por la información, me ha servido de mucho.
Saludos
Por favor ayùdame, he probado esto viendo distinitos blogs, pero no obtengo resultado alguno, puedes guiarme paso a paso, por favor?, mi blog es : http://lunaeterna-larosadelosvientos.blogspot.com/ se necesita permiso para acceder, asi que si puedes dejarme tu mail te lo agradeceré mucho.
Leer el mundo blog, bastante bueno
Publicar un comentario