Tom: Die Simpsons in CSS

Beitrag lesen

Hello,

Erinnert  mich an Urzeiten, wo wir Grafiken durch Punkte erzeugten. Vergleichbarer Aufwand.

Interessant: Wo steckt im CSS der Zeitgeber, der die Augen blinzeln lässt?

Linuchs

z.B. bei Bart:

  
#bart .head .right-eye .eyelid-top  
{  
    top: -18px;  
    left: 0px;  
    width: 30px;  
    height: 17px;  
    border-bottom: 1px solid #110b00;  
    border-radius: 50% 50% 0 0;  
  
    -webkit-animation-name: bartrighteyelidtop;  
    -webkit-animation-duration: 10s;  
    -webkit-animation-timing-function: linear;  
    -webkit-animation-delay: 2.5s;  
    -webkit-animation-iteration-count: infinite;  
    -webkit-animation-play-state: running;  
    animation-name: bartrighteyelidtop;  
    animation-duration: 10s;  
    animation-timing-function: linear;  
    animation-delay: 2.5s;  
    animation-iteration-count: infinite;  
    animation-play-state: running;  
}  
  
#bart .head .right-eye .eyelid-bottom  
{  
    bottom: -11px;  
    left: 0px;  
    width: 30px;  
    height: 10px;  
    border-top: 1px solid #110b00;  
    border-radius: 0 0 50% 50%;  
  
    -webkit-animation-name: bartrighteyelidbottom;  
    -webkit-animation-duration: 10s;  
    -webkit-animation-timing-function: linear;  
    -webkit-animation-delay: 2.5s;  
    -webkit-animation-iteration-count: infinite;  
    -webkit-animation-play-state: running;  
    animation-name: bartrighteyelidbottom;  
    animation-duration: 10s;  
    animation-timing-function: linear;  
    animation-delay: 2.5s;  
    animation-iteration-count: infinite;  
    animation-play-state: running;  
}  
  

Liebe Grüße aus dem schönen Oberharz

Tom vom Berg

--
 ☻_
/▌
/ \ Nur selber lernen macht schlau
Die ultimative Seite für Selbermacher