?

Log in

No account? Create an account

CSS animations

« previous entry | next entry »
Oct. 22nd, 2014 | 03:29 pm

🐺 And you thought blink tags were bad. 🐺

Note: the animation may or may not work depending on the (Livejournal) style used when viewing this entry. If it doesn't work, try this style. If it still doesn't work, it's probably your browser.

Link | Leave a comment | Share

Comments {7}

Winterheart

(no subject)

from: winterheart01
date: Oct. 22nd, 2014 07:21 pm (UTC)
Link

wait till you see this :)

http://www.nganimate.org/

check the example links below

Reply | Thread

Schneelocke

(no subject)

from: schnee
date: Oct. 22nd, 2014 08:00 pm (UTC)
Link

Nice, though I can't help but feel that requiring Javascript is cheating, sort of. ;)

Reply | Parent | Thread

Winterheart

(no subject)

from: winterheart01
date: Oct. 23rd, 2014 05:08 pm (UTC)
Link

well its css3 animations for the most part, ngAnimate is merely the directive for angular to trigger animations on certain events/classes, there is only a bit JS needed for the animation in certain conditions

Reply | Parent | Thread

ungulata

(no subject)

from: ungulata
date: Oct. 22nd, 2014 10:34 pm (UTC)
Link

You must have added extra code to your journal as that line of text doesn't swivel, gyrate or change colour in either LJ's vanilla 'THX 1138' style or in my journal style. There are also two characters that aren't supported in my browser, one at each end of the gyrating phrase.

Lacks flames, kittens and dancing babies. 8^D

Reply | Thread

Schneelocke

(no subject)

from: schnee
date: Oct. 22nd, 2014 10:57 pm (UTC)
Link

Yeah, unfortunately CSS animations cannot be done solely with style attributes on elements — you gotta define the animation in a stylesheet, so if my journal's is not loaded, the animation won't show.

The character is U+1F43A WOLF FACE, one of the Emoji characters added in Unicode 6.0. You'll need a font that has all the right glyphs to see it. If you don't have one, you can also check the code chart to see an example of what the character could look like. (Note that since this is a character rather than a glyph, there is no single "right" way to render it.)

Lacks flames, kittens and dancing babies. 8^D

Your mission, should you choose to accept it... :)

Reply | Parent | Thread

ungulata

(no subject)

from: ungulata
date: Oct. 23rd, 2014 12:00 am (UTC)
Link

Ah, literally a "wolf's face" or a line drawing of a wolf's head. ^_^ "Wolf Face" sounds like a name for a font.

Your mission, should you choose to accept it... :)

Is to relive the glory days of Geocities? 8^D

Reply | Parent | Thread

Schneelocke

(no subject)

from: schnee
date: Oct. 23rd, 2014 12:10 am (UTC)
Link

Ah, literally a "wolf's face" or a line drawing of a wolf's head. ^_^ "Wolf Face" sounds like a name for a font.

It does a bit, doesn't it? I wonder if there is one with that name.

Is to relive the glory days of Geocities? 8^D

...now I've got Bruce Springsteen's "Glory Days" stuck in my head. (And THAT song is probably old enough to be from someone's "glory days" as well in turn, though it isn't quite from mine.)

Reply | Parent | Thread