photoShuffle FL

Save This Page このエントリーを含むはてなブックマーク

PhotoShuffle FLとは?

ABOUT

PhotoShuffle FL はブログに貼られた写真を呼び出して自由にドラッグすることのできる今までにないブログパーツです。 記事を読みながら自由に写真を閲覧することができます。HTMLソースからの画像ファイルの取得はJavaScriptで実装していますが、JavaScriptでは表現できない写真を回転させたり、放り投げたりする表現に関してはFlashを用いています。

  • 写真を閲覧するのにわざわざ別のウィンドウを開く必要はありません。
  • 写真をクリックするとページ内に全ての写真が表示されます。
  • 写真はドッラグして好きな位置に移動できるので、写真の下に隠れた記事を読むこともできます。
  • ページをスクロールすれば写真もそれに追従します。
  • 気に入った写真をダブルクリックすると拡大表示します。
  • PhotoShuffle FL を終了する場合はページの写真以外の場所をクリックします。

デモ

DEMO

ボール ひまわり PowerBook

※写真をクリックして下さい。 PhotoShuffle FL が起動します。

ダウンロード

DOWNLOAD

PhotoShuffle FL v0.9b (2006/11/03)

photoSuffle_FL

更新履歴

PhotoShuffle FL v0.801b (2006/10/30)

PhotoShuffle FL v0.8 (2006/10/27)

使い方

HOW TO USE

  1. ダウンロードしたファイルを解凍してできるphotoShuffleフォルダをサーバにアップロードします。
  2. Javascriptをbodyタグのすぐ下に追加します。(<head>〜</head>内に追加するとうまく動作しません)
    <!--bodyタグのすぐ下-->
    <script type="text/javascript" charset="UTF-8" src="photoShuffle/photoShuffle.js"></script>
  3. PhotoShuffle FL を有効にしたい画像をaタグで囲みそのaタグにrel属性を追加します。
    <a href="archives/photo1.jpg" rel="photoShuffle"><img src="archives/photo1s.jpg" /></a>
  4. 写真をグループ化して関連した写真だけを表示させることもできます。例えば次のようにaタグのrel属性のphotoShuffleの名前を変更してください。
    <a href="archives/photo1.jpg" rel="photoShuffle[group1]"><img src="archives/photo1s.jpg" /></a>
    <a href="archives/photo2.jpg" rel="photoShuffle[group1]"><img src="archives/photo2s.jpg" /></a>
    <a href="archives/photo3.jpg" rel="photoShuffle[group1]"><img src="archives/photo3s.jpg" /></a>

動作確認ブラウザ

COMPATIBILITY TESTED

Win : IE 6, IE 7, Firefox 2.0 (1.5では正常に動作しません)

Mac : Safari 2.0, Firefox 1.5, Opera 9.0

FlashPlayer 8以上

よくある質問

FAQ

Q : a-blogで利用する際にはどうすればいいですか?
HOW TO USE の(1) (2) を行い、config.system.php に $imgLinkRel = "photoShuffle"; と追記して下さい。
Q : Movable Type でも動作しますか?
開発はアップルップルが行っていますが Movable Type 等の設置型のブログでも動作するように設計されています。
Q : ブログ以外でも動作しますか?
静的に作られたHTMLのフォトギャラリー等にHOW TO USEのようにタグを書いてもらうだけでも動作します。いろいろなコンテンツでご利用下さい。

制作スタッフ

PROJECT STAFF:

ライセンスについて

LICENSE:

この PhotoShuffle FL は、クリエイティブ・コモンズ・ライセンスの下でライセンスされています。

Creative Commons License

ご協力ありがとうございました

SPECIAL TAHNKS: