最近コメントが投稿された動画
ニコニコ動画 APIとjQueryを使用した、
サイトURLからRSS出力したフィードを順次表示するシンプルなティッカーです。
Ajaxにおけるセキュリティ上の制約からphpでフィードを中継しています。
ソース及びproxy.phpはjFeedを参考に使用させて頂きました。
jQueryの描画部分については前回に続き、再びこちらのサイトを参考にさせていただきました。
※ フェードイン&フェードアウトの処理
$(document).ready(function(){
var first = 0;
var speed = 300;
var pause = 10000;
function removeFirst(){
first = $('ul#listticker li:first').html();
$('ul#listticker li:first')
.animate({opacity: 0}, speed)
.fadeOut('slow', function() {$(this).remove();});
addLast(first);
}
function addLast(first){
last = '<li style="display:none;">'+first+'</li>';
$('ul#listticker').append(last)
$('ul#listticker li:last')
.animate({opacity: 1}, speed)
.fadeIn('slow')
}
interval = setInterval(removeFirst, pause);
});
※ jFeedによるRSSの処理
jQuery(function() {
jQuery.getFeed({
url: './php/proxy.php?url=http://www.nicovideo.jp/recent?rss=2.0',
success: function(feed) {
var html = '';
for(var i = 0; i < feed.items.length && i < 10; i++) {
var item = feed.items[i];
html += '<li>' + '<a href="' + item.link + '">' + item.title + '</a>' + item.description + '</li>';
}
jQuery('#listticker').append(html);
}
});
});
→戻ります