get twitter feed using json / jquery


/ Published in: JavaScript
Save to your folder(s)

Note: replace "USERNAME" with your own twitter username.
This is using cycle plugin with easing which is applied after the tweets are populated.


Copy this code and paste it in your HTML
  1. function getTwitter(){
  2.  
  3. var panel = $('#twitter_feed');
  4. var tweet = '';
  5.  
  6. if( panel.length > 0 ) {
  7.  
  8. $.ajax({
  9. type : 'GET',
  10. dataType : 'jsonp',
  11. url : 'http://search.twitter.com/search.json?q=USERNAME',
  12.  
  13. success : function(tweets) {
  14.  
  15. $.each(tweets.results, function(i) {
  16.  
  17. var created = tweets.results[i].created_at;
  18. var text = tweets.results[i].text;
  19. var href = 'http://twitter.com/USERNAME/status/'+tweets.results[i].id;
  20. var img = tweets.results[i].profile_image_url;
  21.  
  22. tweet = '<span class="tweet"><img src="' + img + '" /><a href="' + href + '" rel="nofollow">' + text.substr(0, 45) + '..</a></span>';
  23. panel.append(tweet);
  24.  
  25. });
  26. //let's do fade in effect
  27. $('#twitter_feed').cycle({
  28. fx: 'scrollDown',
  29. speedIn: 2000,
  30. speedOut: 500,
  31. easeIn: 'easeOutBounce',
  32. easeOut: 'easeInBack',
  33. delay: 7000
  34. });
  35. }//end each
  36. });//end ajax
  37. }//end if
  38.  
  39. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.