人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

javascriptについての質問です。
twitterのサイドバーウィジェットみたいな、最近のツイートがアニメーションで1つずつ表示されて流れていくアレの作り方orサンプルスクリプトのご紹介をお願いします。

●質問者: bababa
●カテゴリ:インターネット ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● Cherenkov
●50ポイント

jQueryを使ってざっくり。

DEMO:

http://jsfiddle.net/cherenkov/P8QwH/


<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>
$(function() {
 $.getJSON('http://api.twitter.com/1/statuses/user_timeline/hatenaquestion.json?callback=?', function(json) {
 json.reverse().forEach(function(obj, i) {
 var screenName = obj.user.screen_name;
 var text = obj.text;
 var tweet = $('<div class="tweet">').text(screenName + ':' + text)
 .css({'width':'200px','border':'1px solid skyblue', 'font-size':'12px', 'display':'none'});
 setTimeout(function() {
 $('#tw_widget').prepend(tweet);
 tweet.fadeIn(300);
 }, ++i*1000);
 });
 });
});
</script>
</head>
<body>
<div id="tw_widget"></div>
</body>
</html>


関連:

Twitterのタイムラインを表示するウィジェットのような動作をす.. - 人力検索はてな


2 ● kodairabase
●50ポイント

jqueryでtwitterのタイムラインをカンタン表示!

http://d.hatena.ne.jp/tageo/20110202/1296618682

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ