views:

45

answers:

1

How to create this effect where it looks like a newly inserted update shows up at the top of the stack and pushed the rest down? This is how it is done at the twitter home page.

Update.

In case this isn't clear, I am trying to understand the whole effect of how the uipdates section is animated and updated with the smooth scrolling effect, including the animation.

+4  A: 

Please Read How to Ask


UDPATED:

// The following code is untested.
// But should give you an idea of how it could be done.
var container = $("#tweetContainer"),
    speed = 250;

$("<div class='tweet'>1 new tweet</div>")
    .hide()
    .prependTo(container)
    .show(speed);

container.children(".tweet")
    .eq(-1)
    .hide(speed, function(){
        $(this).remove();
    });
David Murdoch
This does not answer the question, how is the animation done and how is the stack re-ordered (the first item inserted, last one out) etc. I am looking at this..which could be a solution. http://www.fiveminuteargument.com/blog/scrolling-list
badnaam
Your question did not mention animation.
David Murdoch
Thanks for the help.My original post clearly specifies.."this effect where it looks like a newly inserted update shows up at the top of the stack and pushed the rest down?", I would think that would be enough to indicate I am not looking for how to do a simple .append() in jquery, pls read the http://api.jquery.com/append/ documenation, it says nothing about pushing other elements out of a visible stack.
badnaam
David Murdoch
Help certainly appreciated, but the question mentioned a live "example" I am not sure how much more "specific" one can get, I think that is plenty specific.
badnaam