NinetNet HTML HTML - Finesser Sidövergångar

Sidövergångar

Om du surfar med Internet Explorer såg du att den här sidan tonades in med en så kallad sidövergång: Reveal transition eller i det här fallet: Blend transition (uppdatera sidan för att se effekten igen).

Reveal transition skrivs in i en meta-tagg i sidans huvud och skapar en övergångseffekt när besökarna kommer till eller lämnar sidan genom att man anger page-enter eller page-exit. Det går också bra att välja båda. Men kom ihåg att funktionen bara fungerar i Internet Explorer.

Om du kodar din sida enligt strict standard bör du avstå från den här finessen! Då ska man ju undvika att styra sidans beteende och överlämna det åt besökaren.

Tänk också på att det kan bli ganska jobbigt för besökarna om varje sida öppnas med en massa knasiga effekter...

Så här kan det se ut i koden om du vill ha en tonande effekt - som på den här sidan: Blend. Här används både "page-enter" eller "page-exit" d.v.s. sidan både tonas in och ut.


<html>

<head>

<title>Sidans Titel</title>

<meta http-equiv="page-enter" content="blendtrans (duration=5)">

<meta http-equiv="page-exit" content="blendtrans (duration=5)">

</head>

<body>

- - - - - -

<body>

</html>

Med duration bestäms hur lång tid övergången ska ta. Ju högre värde man anger desto längre tid tar övergången. Prova dig fram - men ett värde mellan 3 och 5 brukar bli bäst.

Förutom effekten "blend" i exemplet ovan finns det hela 23 olika övergångseffekter att välja på. Då anger man revealtrans i stället för "blendtrans" och bestämmer typen med transition och en siffra från 0 till 23. Nedan finns en beskrivning av allihop och så här skulle det kunna se ut i koden:


<head>


<meta http-equiv="page-enter" content="revealtrans (duration=4, transition=23)">


</head>

transition=0	Box in	Krympande ruta
transition=1	Box out	Växande ruta
transition=2	Circle in	Krympande cirkel
transition=3	Circle out	Växande cirkel
transition=4	Wipe up	Rullar nerifrån och upp
transition=5	Wipe down	Rullar uppifrån och ner
transition=6	Wipe right	Rullar från vänster till höger
transition=7	Wipe left	Rullar från höger till vänster
transition=8	Vertical blinds	Vertikal persienneffekt
transition=9	Horisontal blinds	Horisontal persienneffekt
transition=10	Checkerboard across	Ruteffekt vänster till höger
transition=11	Checkerboard down	Ruteffekt uppifrån och ner
transition=12	Random dissolve	"Noise" tonar in sidan
transition=13	Split vertical in	Vertikalt från sidorna in
transition=14	Split vertical out	Vertikalt från mitten till sidorna
transition=15	Split horisontal in	Horisontalt från sidorna in
transition=16	Split horisontal out	Horisontalt från mitten till sidorna
transition=17	Strips left down	Diagonalt från övre högra hörnet till nedre vänstra
transition=18	Strips left up	Diagonalt från nedre högra hörnet till övre vänstra
transition=19	Strips right down	Diagonalt från övre vänstra hörnet till nedre högra
transition=20	Strips right up	Diagonalt från nedre vänstra hörnet till övre högra
transition=21	Random bars horisontal	Horisontala streck tonar in sidan
transition=22	Random bars vertical	Vertikala streck tonar in sidan
transition=23	Random	De ovanstående slumpvis

Till Toppen

Tillbaka till HTML - Finesser