CSS3 Animated Cheat Sheet

A cool page I got through email.
Check it out!

http://www.justinaguilar.com/animations/index.html


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Nice. Have you tried any??


Ernie Simpson

On Thu, Aug 1, 2013 at 8:59 AM, Sebastian Crewe-Turrell <
email@hidden> wrote:

A cool page I got through email.
Check it out!

CSS3 Animation Cheat Sheet - Justin Aguilar


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Not yet. Maybe tonight if I find some time! :slight_smile:

Seb


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On this example page the animations activate once your scroll down the page. Does anyone know how to set this up? This would look pretty nifty and something i’ve been wanting to do for a while now…

http://www.justinaguilar.com/animations/scrolling.html


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

duh! it’s right there in the page! Told you I was short of time haha


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Just had a couple of mins to put together a quick example of it looking goood in freeway. Nice and simple to create.

http://www.tinyshark.co.uk/cssanimations/


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Nicely done!


Ernie Simpson

On Fri, Aug 2, 2013 at 3:01 PM, Sebastian Crewe-Turrell <
email@hidden> wrote:

Just had a couple of mins to put together a quick example of it looking
goood in freeway. Nice and simple to create.

Freeway CSS3 Animations


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Congratulations Sebastian!
Today I spend the whole afternoon with the cheat sheet and had much fun with the effects on page load (I tried FW5.5 and FW6). But adding the jQuery drove me nuts. Although I did as described I must have done something completely wrong: When rendering the page in the browser no element appeared at all. To be honest, I am not into code so far, so I’m glad that someone figured out how to do it right. Would you be so generous to share your FW-file with us, so that we challenged can take a glimpse behind the curtain?
Another question: How would you add delay to elements so they can appear in sequence?

Best regards, Siegmar


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Siegmar,

I’ve added a download link to the bottom of the page for your perusal.

I know you can add a delay to elements using jQuery but could say exactly how to do it. I’ll have a play now and see if I can come up with something.

Seb


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Just figured out how to add delay to elements. Now the title and sub-title are animated. The main title animates instantly whilst the sub-title has a delay of 750ms.

I have added these updated to the downloadable doc.

Thanks,

Seb


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The Tiny Shark SVG logo is in a weird container with scroll bars.

David


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Also you have scriptaculous AND prototype AND jQuery on the same page - which always leads to tears.

D


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Good catch! I had the sticker action still enabled as I was playing with something earlier. Should be good now…

With regards to the logo, I can’t get the scroll bars to appear here using chrome/safari. What browser are you using?

Seb


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Safari

D


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I should have said Safari 5.1.9


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks for the screens Dave. Strange though. I’ve gone back to .png while I take a look at whats causing this. Seems as though its not scaling the file properly.


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi Sebastian, many thanks for providing your source file. This is very kind. Now I have the possibility to explore.
Siegmar


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options