5492 posts
  • 5 Years of Membership
  • Affiliate Level 1
  • Australia
  • Author Level 3
+5 more
Australia
says

I have a page that I want to animate some divs on so they slide in from the right of the page ( hidden on load ) and are centered to the width of the page at a specific position, but do not appear until 10 seconds AFTER the page has fully loaded.

Can you kindly point me in the right direction, I could have a bash myself, but will end up spending 3 days buggering about.

will add an image of what I am after in cpl mins.

595 posts
  • 1 Year of Membership
  • Author Level 2
  • Exclusive Author
  • Ghana
IsaacA
says

I have a page that I want to animate some divs on so they slide in from the right of the page ( hidden on load ) and are centered to the width of the page at a specific position, but do not appear until 10 seconds AFTER the page has fully loaded.

Can you kindly point me in the right direction, I could have a bash myself, but will end up spending 3 days buggering about.

will add an image of what I am after in cpl mins.

An image will greatly help

5492 posts
  • 5 Years of Membership
  • Affiliate Level 1
  • Australia
  • Author Level 3
+5 more
Australia
says

Gawd you guys are fast lol

2792 posts Bird is the word..
  • Top Monthly Author
  • Trendsetter
  • Weekly Top Seller
  • United States
+11 more
jonathan01
says

You could also use basic css transitions with a delay to do this bud. Here’s a great little explanation and tut:

http://css3.bradshawenterprises.com/transitions/

I used something like you mentioned on one of my freebie sites:

http://cr3ativstyles.com
5492 posts
  • 5 Years of Membership
  • Affiliate Level 1
  • Australia
  • Author Level 3
+5 more
Australia
says

ahhh I know how to do css animations, it was the delay that was buggering me up. Cheers Jon will have a looksy ;)

595 posts
  • 1 Year of Membership
  • Author Level 2
  • Exclusive Author
  • Ghana
IsaacA
says

ahhh I know how to do css animations, it was the delay that was buggering me up. Cheers Jon will have a looksy ;)

The transition-delay property can help you there :)

2792 posts Bird is the word..
  • Top Monthly Author
  • Trendsetter
  • Weekly Top Seller
  • United States
+11 more
jonathan01
says


ahhh I know how to do css animations, it was the delay that was buggering me up. Cheers Jon will have a looksy ;)
The transition-delay property can help you there :)

That’s what I gave him a link to bud ;)

595 posts
  • 1 Year of Membership
  • Author Level 2
  • Exclusive Author
  • Ghana
IsaacA
says



ahhh I know how to do css animations, it was the delay that was buggering me up. Cheers Jon will have a looksy ;)
The transition-delay property can help you there :)
That’s what I gave him a link to bud ;)

Yeah, credit for that.

224 posts
  • Affiliate Level 1
  • Author Level 5
  • Collector Level 1
  • Bundle Boss
+4 more
WPAlchemy
says
$(document).ready(function() {
    setTimeout(function() {
        /* Do animation here */
    }, 10000);
});

CSS delays start counting as soon as CSS is loaded, and not when the page finished loading.

5492 posts
  • 5 Years of Membership
  • Affiliate Level 1
  • Australia
  • Author Level 3
+5 more
Australia
says

Thanks WPA , my primary concern was cacheing. Hence I thought jQuery would work better. Will have a play, and thanks guys sincerely appreciate your help :)

You Rock

by
by
by
by
by
by