Kom ihåg mig?
Home Menu

Menu


Delay på text via CSS

 
Ämnesverktyg Visningsalternativ
Oläst 2013-12-26, 01:50 #1
pelmereds avatar
pelmered pelmered är inte uppkopplad
Har WN som tidsfördriv
 
Reg.datum: May 2010
Inlägg: 1 342
pelmered pelmered är inte uppkopplad
Har WN som tidsfördriv
pelmereds avatar
 
Reg.datum: May 2010
Inlägg: 1 342
Du får göra det med custom-annimation och keyframes. T.ex. såhär:

Kod:
.delayed-fading-text {
        opacity: 0;
        animation: fadeIn 3s linear 5s;
        -webkit-animation: fadeIn 3s linear 5s;
}

@keyframes fadeIn
{
    0%  {opacity: 0;}
    100%  {opacity: 1;}
}
@-webkit-keyframes fadeIn
{
    0%  {opacity: 0;}
    100%  {opacity: 1;}
}
Med den här koden är animationens längd 10 sekunder vilket gör att texten börjar fadea in efter 5 sekunder och har når 100% opacitet på 3 sekunder, vilket innebär att texten får 100% opacitet 8 sekunder efter att sidan laddades.

Notera att koden är otestad skriven ur minnet, men den bör fungera.
pelmered är inte uppkopplad   Svara med citatSvara med citat
Svara


Aktiva användare som för närvarande tittar på det här ämnet: 1 (0 medlemmar och 1 gäster)
 

Regler för att posta
Du får inte posta nya ämnen
Du får inte posta svar
Du får inte posta bifogade filer
Du får inte redigera dina inlägg

BB-kod är
Smilies är
[IMG]-kod är
HTML-kod är av

Forumhopp


Alla tider är GMT +2. Klockan är nu 22:44.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson
 
Copyright © 2017