Google+ Tools
Make Google+ profile picture
Make Google plus banners for profile
Create and share your Google Plus profile banners.

Profile image for mrk studios mikemore on November 28, 2010

Simple jQuery script to display Twitter trending stories of your website and their Twitter trackbacks by combining 2 of my jQuery plugins - Popular on Twitter Widget & Twitter Trackbacks Widget. Read more

Language
jQuery
Tags

Combining Your Trending Stories with Twitter Trackbacks!


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://popular-on-twitter.googlecode.com/files/jquery.popular-on-twitter-1.1.min.js"></script>
<script type="text/javascript" src="http://twitter-trackbacks-widget.googlecode.com/files/jquery.twittertrackbacks-1.0.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
   // call popular on Twitter widget on document ready
   $('#popular').popularOnTwitter({
      site: 'moretechtips.net'
      ,show_n: 0
      ,window: 'a'
      ,n: 5
      ,show_tweet: 0
      ,tweeter_text: '<\a href="#" class="get-trackbacks" title="Expand/Collapse tweets">+<\/a> by _d_'
      ,loaded: popularLoaded
   });
});

function popularLoaded(){
   var div = $('#popular');
   // for each link li
   $('li',div).each(function(){
      var li = $(this);
      // get url of the link
      var url = $('.pot-url a',li).attr('href');
      // bind click handler to the + link
      $('a.get-trackbacks',li).click(function(){
         var a = $(this);
         // trackbacks div
         var tb_div= $('div.trackbacks',li);
         
         // trackbacks div is there ?
         if(tb_div.size()==0) {
            // create trackbacks div for the first call
            tb_div= $('<\div class="trackbacks"><\/div>').appendTo(li);
            // call trackbacks widget
            tb_div.twitterTrackbacks({
               url:url
               ,n:5
               ,show_n:0
            });
            // change + link to -
            a.text('-')
         }else{
            // div was created
            if( tb_div.css('display')=='none') {
               // show if hidden
               tb_div.fadeIn(200);
               // change + link to -
               a.text('-');
            }else {
               // hide if shown
               tb_div.fadeOut(200);
               // change - link to +
               a.text('+');
            }
         }
         // return false to disable default behavior of link click
         return false;
      });
   });
}
</script>

Comments

blog comments powered by Disqus