Simple jQuery Plugin for Displaying Recent Tweets - jtwt.js
File Size: | 9.04KB |
---|---|
Views Total: | 4632 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
jtwt.js is a lightweight jQuery plugin that allows you using twitter json API to display anyone's recent tweets on your web page or elsewhere. You're free to use jtwt.js in personal and commercial projects.
You may also be interested in:
- Social Feed Plugin with jQuery - SOCIALIST
- jQuery Plugin For Displaying Multiple Social Feeds On One Page
- Facebook-like Twitter Follower Box
How to use it:
1. Include jQuery Library and jtwt.js on the web page
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="js/jtwt.min.js"></script>
2. Markup
<div id="twitter"></div>
3. The CSS
#jtwt { list-style: none; } #jtwt li { margin-bottom: 10px; } #jtwt li:last-child { margin-bottom: 0px; } #jtwt_loader { font-weight: bold; } .jtwt_picture { float: left; margin-right: 10px; } p.jtwt_tweet_text { text-align: justify; } a.jtwt_date { font-size: 12px; } #jtwt { border-radius: 2px; overflow: hidden; } #jtwt li { background: #38363f; padding: 10px; margin-bottom: 5px; } #jtwt .jtwt_tweet:last-child { margin-bottom: 0px; } .jtwt_picture { float: left; margin-right: 10px; } .jtwt_picture img { border-radius: 2px; } .jtwt_tweet_text { margin-bottom: 0px; } .jtwt_date { display: inline-block; width: 100%; text-align: right; line-height: 12px; font-size: 12px; }
4. Call the plugin with options
<script type="text/javascript"> $(window).load(function() { $('#twitter').jtwt({ username: 'jqueryscript', count: 5, image_size: 24 }); }); </script>
5. Options
- count : int, // The number of displayed tweets.
- username : 'yourusername', // Your username.
- image_size : int, // The size of your avatar.
- loader_text : 'loading tweets', // loading text
This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.