ページ

2011年6月6日

Re-render Tweet button via JS

stackoverflowの記事にあるように、以前はTweetButtonがあってJavaScirptで後からロードしたHTMLに対してTweetButtonをレンダリングすることができました。でも、気がついたらこれができなくなっています。@anywhereっていうライブラリを使えば、Tweet Boxっていうのは表示できるらしいですが、Tweet Buttonは表示できません。ちなみに僕はTweet Boxが何なのか知りません。で、いろいろ調べると、情報がありません。以前の方法でやるのはあきらめます。Tweet Buttonを表示するのはJavaScriptでやる方法とiframeを使う方法の二つがあります。JavaScriptを使うのはあきらめたので、iframeでがんばります。

JavaScriptはtwitter-share-buttonというクラスを当てたaタグをボタンに変身させる技を使っていました。iframeを使う方はもっと簡単です。次のhtmlの断片で実現できます。

<iframe allowtransparency="true" frameborder="0" scrolling="no"
        src="http://platform.twitter.com/widgets/tweet_button.html?url=エスケープしたURL"
        style="width:130px; height:20px;"></iframe>

これをDOM要素にあとから追加していけば、TweetButtonがあとからあとからどんどん現れていきます。めでたしめでたし。
タイトルにvia JSとあるのに、JavaScriptが全然書いていないので、ちょっとだけ書くと、jquery使っていれば上の断片をfragmentっていう変数に入れているとして、
$("#どこかの要素").append(fragment)
ほら、via JSになった。

これ、http://twwweet.liris.org/で使っているんですが、まだ、本番環境には入れていない・・・。


でわでわ

0 件のコメント: