Big Sky :: jQueryのjqAlbumParserプラグインかっこいい

2008/03/06

jQueryのjqAlbumParserプラグインかっこいい

結構見逃してる物多いなぁ。

jQuery: jqAlbumParser Plugin, parses out Flickr, Picasa clientside | The Book and the Cover

カッコイイ。
実装するのもそれ程難しくないしサイトの端っこにでも貼り付けても面白いかもしれない。
動作としては、jqAlbumParserがFlickrのFeedをパースする物で、それを表示する為のプラグインがjqGalViewIIとの事。
よってコードは

<style media="all">
@import url("/path/to/css/jqGalViewII.css");
</style>
<script type="text/javascript" src="/path/to/javascript/jquery-latest.js"></script>
<script type="text/javascript" src="/path/to/javascript/jqAlbumParser.js"></script>
<script type="text/javascript" src="/path/to/javascript/jqGalViewII.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $(".jqAlbumParser").jqAlbumParser({
        pluginExec : function(){$(this).jqGalViewII();}
    }).click();
});
</script>
<a href="http://api.flickr.com/services/feeds/photos_public.gne?ids=YOUR_FLICKR_ID"
    class="jqAlbumParser wa:flickr">my flickr feed</a>

こんな感じ。「$(document).ready」を使わず実行したいならば「.click()」の所を「.trigger('load')」にすれば自動で表示される。
アンカーのクリックアクションで動作させたいならば、何も指定しないか「.trigger('click')」で行けます。
またfeedのURLの最後に「&tags=XXXX」とすれば、そのタグで絞り込める。簡単なソースで結構リッチなアルバムビューワが出来るって凄いなぁ。

以下、私のflickrで実行した例
mattn's flickr feed

追記
IE6だとこのサイトのせいなのか動かなかったので、そこだけ切り出したサンプルを作りました。