2008/03/12

Recent entries from same category

  1. xtag と angular1 を足して2で割った感じに使える薄い JavaScript ライブラリ「sj.js」
  2. Web Component を簡単に作れる JavaScript ライブラリ「X-Tag」
  3. twitter.bat
  4. jQueryプラグインとして動作するGithub Badge作ってみた。
  5. XSLとjQuery/HTMLだけで作る、amazon最速検索

結構見逃してる物多いなぁ。
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だとこのサイトのせいなのか動かなかったので、そこだけ切り出したサンプルを作りました。
サンプル


AWSWORD:javascript:
Posted at by | Edit