3744 posts
  • Won a Competition
  • Elite Author
  • Sold between 100 000 and 250 000 dollars
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Exclusive Author
  • Spain
  • Referred between 200 and 499 users
+5 more
pezflash says
$(document).ready(function() {
    $("#thumbs").delay(10000).animate({
        opacity: 1,
        left: 0        //WHATEVER YOUR X POS
    }, 1000, function() {
        // Animation complete
    });
});
5072 posts
  • Australia
  • Bought between 100 and 499 items
  • Community Superstar
  • Exclusive Author
  • Has been a member for 3-4 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
Australia says

Hey cheers guys.

I created this so far,
$(document).ready(function() {
        setTimeout(function() {
            var first = $('#coolDiv-1').offset().left;
            $("#coolDiv-1").css({first:first}).animate({"left":"10px"}, "slow");
            }, 8000);
        setTimeout(function() {
            var second = $('#coolDiv-2').offset().left;
            $("#coolDiv-2").css({second:second}).animate({"left":"170px"}, "slow");
            }, 10000);
        setTimeout(function() {
            var third = $('#coolDiv-3').offset().left;
            $("#coolDiv-3").css({third:third}).animate({"left":"330px"}, "slow");
            }, 12000);
        setTimeout(function() {
            var fourth = $('#coolDiv-4').offset().left;
            $("#coolDiv-4").css({fourth:fourth}).animate({"left":"490px"}, "slow");
            }, 13500);
        setTimeout(function() {
            var fifth = $('#coolDiv-5').offset().left;
            $("#coolDiv-5").css({fifth:fifth}).animate({"left":"650px"}, "slow");
            }, 14500);
        setTimeout(function() {
            var sixth = $('#coolDiv-6').offset().left;
            $("#coolDiv-6").css({sixth:sixth}).animate({"left":"810px"}, "slow");
            }, 15000);
            });

I think what I have done is correct, no errors and all works, just wondered about adding elastic stuff? easeinout etc

57 posts
  • Bought between 1 and 9 items
  • Sold between 1 000 and 5 000 dollars
  • Indonesia
  • Has been a member for 1-2 years
  • Exclusive Author
  • Microlancer Beta Tester
DavidGuns says

I think you can use jquery extend to make it simple

224 posts
  • Sold between 10 000 and 50 000 dollars
  • Author had a File in an Envato Bundle
  • Referred between 1 and 9 users
  • Bought between 1 and 9 items
  • Has been a member for 0-1 years
  • Argentina
  • Exclusive Author
WPAlchemy says

For a better effect I would add all animations into the same timeout and just change the animation speed for each of them. You will see the effect is a lot nicer (less linear).

5072 posts
  • Australia
  • Bought between 100 and 499 items
  • Community Superstar
  • Exclusive Author
  • Has been a member for 3-4 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
Australia says

I would if I could lol, will have a bash tho. :) Will probs make a jsfiddle in a few mins, then anyone can pitch in on the actual code :)

5277 posts The Dude Abides
  • United States
  • Exclusive Author
  • Has been a member for 5-6 years
  • Elite Author
  • Sold between 100 000 and 250 000 dollars
  • Bought between 100 and 499 items
  • Referred between 100 and 199 users
+5 more
CodingJack says

Jonathan’s advice is good as CSS3 is going to be much smoother than jQuery. Here’s an example:

http://jsfiddle.net/uHTUG/
5072 posts
  • Australia
  • Bought between 100 and 499 items
  • Community Superstar
  • Exclusive Author
  • Has been a member for 3-4 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
Australia says

Jonathan’s advice is good as CSS3 is going to be much smoother than jQuery. Here’s an example: http://jsfiddle.net/uHTUG/

Looks better than my version, but I tried dovetailing your code into mine, and just got in a right darn mess. ( please wait a few seconds for it to kick in )

http://jsfiddle.net/ozzy/B8k4q/
57 posts
  • Bought between 1 and 9 items
  • Sold between 1 000 and 5 000 dollars
  • Indonesia
  • Has been a member for 1-2 years
  • Exclusive Author
  • Microlancer Beta Tester
DavidGuns says

you can do a lot animate with animate.css check my simple work http://jsfiddle.net/DavidGuns/RJr2X/1/

don’t forget to rate star. kidding :D

5072 posts
  • Australia
  • Bought between 100 and 499 items
  • Community Superstar
  • Exclusive Author
  • Has been a member for 3-4 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
Australia says

Thanks David

any chance one of you guys could edit my fiddle :)

Will show you the final page once its all done, its pretty neat.

5072 posts
  • Australia
  • Bought between 100 and 499 items
  • Community Superstar
  • Exclusive Author
  • Has been a member for 3-4 years
  • Interviewed on the Envato Notes blog
  • Microlancer Beta Tester
  • Referred between 1 and 9 users
  • Sold between 1 000 and 5 000 dollars
Australia says

Finally nailed it, cheers guys ;)

by
by
by
by
by
by