Animated Twitter Feed widget with Simple JavaScript

Demo Download Code
Here is a quick implementation of Twitter Feed using Simple JavaScript, No frameworks are used. Lets start with the HTML

<div id=”feedWraper”>
<div id=”twitterFeed”></div>
<div id=”feedCache”></div>
</div>

• “feedWraper ” holds the widget , hence its width and height should be fixed.
• “twitterFeed” contains all the tweets , and its will be animated with simple JavaScript
• “feedCache” is a hidden div that stores the tweets.

The whole process can be divided into three

1. JSONP Call
2. Parsing JSON results [tweets]
3. Animation

For the JSON call to work properly, all the supporting elements and reference functions should be available before the JSON request. That means all the HTML , CSS and JavaScript for the widget should be on the top and JSON Call should be at the bottom.

read more