Freelance Web Developer

Apr 15, 2010

Set twitter hovercard anywhere

I like the twitter Hovercards feature because it shows profile information about a particular user and option to follow or block, whenever hovers over a user name.
I had implemented it with twitter api. Today i found a new cool way to create hovercard on our web page with @anywhere.


Twitter @Anywhere is an easy to deploy solution for bringing the Twitter communication platform to your own site.
NOTE : i am describing here just - "Implanting Hovercard"


First goto and get an APIKEY

 <script src="" 

 <script type="text/javascript">
      // Initialization
     function onAnywhereLoad(twitter) {
        // this is the callback function you specified in your initializer


<p>@<class="twitter-anywhere-user" href="">dharmmotyar</a> is a FreelancerFounder and Lead Developer for @<class="twitter-anywhere-user"  href="">000Labs</a>, writes for @<class="twitter-anywhere-user" href="">motyar</ablog</p>

Hovercards will then be enabled on mouseover for all anchor tags matching the default linkify class name, <a class='twitter-anywhere-user'></a>.

To automatically linkify Twitter screen names, use the twitter.linkifyUsers() function in your initializer callback like this -

 function onAnyWhereLoad(twitter) { 


Here is the demo, hover the twitter usernames.

@ is a Freelancer, Founder and Lead Developer for @, writes for @ blog

Related Posts

Show your twitter avatar on your page
Create a twitter hovercard with help of api

Labels: , ,

If anything helps, feel free to buy me a beer.

By :