Det här Lagret med text ligger under det animerade Lagret. När det animerade Lagret ändrar storlek mellan två eller flera Keyframes ger det en "rullgardinseffekt".

OBS! När du ändrar bildrutorna i Timeline, kom ihåg att det bara är i en Keyframe en händelse kan ske. Om du ändrar längd på Timeline kan du behöva ta bort den blå rutan med den Behavior som startar Loopen, den ligger annars kvar i fel bildruta och startar om animeringen för tidigt eller för sent. Lägg till loopen när animeringen är helt klar...

Exempel på storleksändring: Loopande Rullgardin...

Exempel på Lager som växlar mellan att vara synliga eller dolda!

Lägg dem i olika Animation Channels...

...men på samma Timeline.

Exempel på byte av bilder i Lager.
Kan göras på två sätt:

1. Byt sökvägen till bilden i samma Lager så att ny bild hämtas. Kan vara en långsam metod då bilden hämtas och laddas ner under själva animeringen.
2. Lägg bilderna i olika Lager och visa eller dölj Lagren enligt metoden ovan. Fördelen är att de laddas samtidigt som websidan och ligger klara att användas...

Gillar du den här guiden? Vill du att vi ska fortsätta göra fler guider? - läs mer här » 

skriv ut»

 

Animera Lager med Timelines (MX)

Animera Animera Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layer - Lager - Layers Lager - Layers

 

Med Tidslinjerna (Timelines) i Dreamweaver kontrollerar du Lager med innehåll. Animationerna styrs av javascript och kräver inga andra programvaror än webläsaren (som måste vara version 4 eller senare...). Animering kan innebära förflyttning, storleksändring, stapelordning och även låta bilder bytas ut. (Läs mer om Lager i övningen "Lager - Layers" »)

 

Timelines (Tidslinjer)

...

 

 

 

 

 

Enkel förflyttning av bild eller text

Timelines kan bara animera Lager. Alla objekt; text, bilder mm måste alltså placeras i ett Lager (Läs mer om Lager i övningen "Lager - Layers" »).

...

 

 

 

 

 

 

 

 

 

 

Ändra animeringens tidslängd och rörelse

...

Ändra riktning

...

 

 

 

 

 

 

 

 

 

 

 

 

Ändra riktning med en (Skiktväg) Path

För mer komplexa rörelser krävs en hel del Keyframes och det kan vara tidsödande att manuellt lägga till dem och flytta Lagret för varje Keyframe. Du kan då använda en "Path" (Skiktväg) och koppla den till Lagrets rörelse.

 

 

 

 

 

 

 

 

 

 

 

Ändra Behaviors för startåtgärd och antal Loopar

...

 

 

 

Byt bild och egenskap under animering

Lagrets egenskaper och bildkälla kan ändras under animeringen. Lagrets egenskaper som storlek, synlighet och stapelordning kan ändras (Läs mer om Lagers egenskaper i övningen "Lager - Layers" »). Dessutom kan du ändra sökvägen till bilder som finns i Lagret.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Starta och stoppa animering med Behaviors

I de tidigare exemplen har animationerna startats automatiskt när sidan laddas i webläsaren. Om du vill starta en animering genom att klicka på en länk eller föra muspekaren över en bild. Använd Behaviors för att starta eller stoppa en Timeline.

 

 

 

 

 

 

 

 

 

 

 

 

 

... (guiden omfattar 13 sidor)

WDS medlem och WDS CD kan du beställa här »

 

Copyright © w w w . w e b d e s i g n s k o l a n . s e
Materialet får skrivas ut och användas för personligt bruk.
Användning i undervisningssyfte är ej tillåten utan vårt tillstånd - läs mer här »