Scripy 8

Para ver el trabajo final pulsar AQUI

Materiales, un tag de las siguientes dimensiones, 228x450

fondo a juego y una imagen gif de tamaño 30 de ancho para el desplazamiento vertical y 30 de alto

para el horizontal. yo use el mismo gif pero con el animation lo rote 90º para que cuadraran las medidas

Intentare explicar algo mas detallado para que podamos entender a los containes y las dimensiones

tener en cuenta que el ancho máximo que disponemos en nuestra pantalla del ordenador

es la misma que la de un walpaper, en este caso yo use el tamaño de 1024 px y el alto el que necesitéis,

segun el tutorial el paño se adapta a 1055 px

Para que os hagáis una idea de la composición mirar la captura con las diferentes dimensiones de los containers,

mirar los tres primeros containers que hemos puesto, el primero el tamaño total, 1024x1155,

Al segundo las medidas son 60 px menos, por lo tanto 964x1055 y la situacion sería

dejando el espacio de 60 a la izquierda y 60 respecto al top

Y el tercero le restamos 120px por lo que queda 904x995 y el espacio de margen sería 120

Tanto al scroll de arriba como a los que hay en la izquierda del paño como mis imagenes gif utilizadas miden 30 px de ancho le di a cada una un espacio de 60 justo el doble, para que no se vieran demasiado pegadas tanto en la horizontal como en la vertical

Los distintos containes que vamos a ver estan cuadrados según la siguiente disposición

Si observamos las medidas de los container dependen en todo momento de las imagenes gif que hayamos puesto , como yo deje una separacion de 60 px entre marcos fijaros que las medidas tienen una diferencia de 60 px exactamente para que al final cuadre el final de los frames o marcos tanto en el lado derecho como en la parte inferior de la siguiente manera

Una vez que teneis estas capturas os pongo ahora los pasos para realizar el trabajo

Abrimos el scrippy

*Insertamos un positioned scroll

layout:vertical Direction scroll: up

Pixel por second:10 Pixel per move: 1

Smooth scroll: pulsado

Position: from left Distance :20 Lo demas todo a 0

*Pulsamos en preview

*Insertamos positioned scroll

Layout: vertical Direction scroll: down

Pixel por second:10 Pixel per move:1 Positions :from left

Distance : 80(esta medida depende de la imagen gif usada)

Fast scroll: pulsado Transparency : 50

*Volvemos a preview

*Insertamos positioned scroll

Layout: horizontal Direction scroll:left

Pixel por second:10 Pixel per move:1 Positions :from top

Distance : 20 Smooyh scroll: pulsado lo demas todo a 0

*Pulsamos en preview

*Insertamos positioned scroll

Layout: horizontal Direction scroll: right

Pixel por second:10 Pixel per move:1

Positions :from top

Distance : 80 ( esta mmedida depende de la imagen gif usada)

Fast scroll: pulsado Transparency : 50

*Vamos a preview

*Insertar positioned container

Horizontal layout

Set position and width: pulsado Position from: left

Distance: 0 Specified size:1024

Vertical layout

Set position and heigth Position from:top

Distance:0 Specified size:1155

*Insertar frame, elegirle color y estilo

Place over background: pulsado

*Vamos a preview

*Insertar positioned container

Horizontal layout

Set position and width: pulsado

Position from: left

Distance:60 Specified size:964

Vertical layout

Set position and heigth

Position from:top

Distance: 60 Specified size:1055

*Insertar frame, el mismo color y estilo que la enterior

Place over background: pulsado

*Insertar backgroun, no scroller,pulsar tile

*Ir a preview

*Insertar positioned container

Horizontal layout

Set position and width: pulsado

Position from: left

Distance:120 Specified size:904

Vertical layout

Set position and heigth

Position from:top

Distance: 120 Specified size:995

*Insertar frame con las mismas caracteristicas que las anteriores

*Ir a preview

*Insertar positioned container

Horizontal layout

Set position and width: pulsado

Position from: left

Distance:15 Specified size:288(ancho de nuestro tag)

Vertical layout

Set position and heigth

Position from:top

Distance: 15 Specified size:450 (alto de nuestro tag)

*Insertar positioned image

Una imagen de un tamaño aprox:288X450

Horizontal y vertical:center

*Insertar frame, el mismo color y estilo que la enterior

Place over background: no pulsado

*Ir a preview

*Insertar sound, tiker y loading message

*Insertar message area

Left:340 top: 300 right:30 b ottom:30

Guardar y exportar al outlook o a pagina web

Tutorial realizado por Piconera y adaptado por EnergiaElca