TwitterのjQueryプラグイン『Tweet!』を使ってみた

TwitterのjQueryプラグイン『Tweet!』を使ってみた | qazqaz note“使ってみた”って書いたけど、ずいぶん前から使ってます。

Tweet!さんはアバター表示が出来て、複数アカウントでの取得・表示が可能で、使い方によってはとっても面白い事出来ますw

本業で使うときはかなりいじったソースでほぼ原形を留めてないけどww

サンプルソースなんでご参考まで。。

表示サンプル


shin_qazの最近のつぶやきを3件表示

linux“で検索した結果を5件表示

ソース

上記で表示しているサンプルのソースは以下の通りです。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="/uploads/2012/05/jquery.tweet_.js"></script>
<link rel="stylesheet" type="text/css" href="/uploads/2012/05/jquery.tweet_.css" />

<script type="text/javascript">
// <![CDATA[
$(function() {
     $(".tweet").tweet({
          join_text: "auto",
          username: "shin_qaz",
          avatar_size: 48,
          count: 3,
          auto_join_text_default: "we said,",
          auto_join_text_ed: "we",
          auto_join_text_ing: "we were",
          auto_join_text_reply: "we replied",
          auto_join_text_url: "we were checking out",
          loading_text: "loading tweets..."
     });
     $(".query").tweet({
          avatar_size: 32,
          count: 5,
          query: "linux",
          loading_text: "searching twitter..."
     });
});
// ]]>
</script>

<p><a href="http://twitter.com/shin_qaz">shin_qaz</a>の最近のつぶやきを3件表示</p>
<div class="tweet"></div>

<p><a href="http://search.twitter.com/search?q=linux">linux</a>"で検索した結果を5件表示</p>
<div class="query"></div>

サンプルソースの解説。。

1行目
jQueryを読込み。例のヤツ使ってマスw

2行目
Tweet!(今回の主役)を読込み。(javascriptファイル)

3行目
Tweet!(今回の主役)を読込み。(cssファイル)

8~19行目
指定ユーザ(10行目)のツイートを取得

20~25行目
指定クエリ(23行目)でのツイートを取得

31行目
ユーザのツイートを表示

34行目
クエリのツイートを表示

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください