Js implements a method similar to Sina Weibo's homepage content for gradual display, and the homepage content for gradual display

Js implements a method similar to Sina Weibo's homepage content for gradual display, and the homepage content for gradual display

The example in this article describes how js achieves a gradual effect similar to Sina Weibo's homepage content. Share it with you for your reference. The specific analysis is as follows:

Key Aspect 1:

if(list_li.length>=1){list.insertBefore(li,list_li[0]);}else{list.appendChild(li);}

Insert new content from the front. If there is no new content, insert new content to the back.

Key Aspect 2:

var height=li.offsetHeight;li.style.height='0';

Obtain the li height, and then set the li height to 0, because the height changes from 0 to the existing height.

Key Aspect 3:

startrun(li,"height",height,function(){startrun(li,"opacity","100");})

First, high change, then transparency change

Finally, run the following code:

<! DOCTYPE html> 
I hope this article will help you design javascript programs.