ギャラリー改造

アップグレードの内容

ホームページギャラリーをアップグレードしました。 サムネールをクリックして、画像を拡大するのは変更無しだけど、拡大された画像の表示が変わりました。

新規ページに移動せず、画像が同じページの上に表示される機能を追加しました(ブラウザの「戻る」ボタンを使わなくてもサムネールギャラリーに簡単に戻れます)。

同時に、各コレクション(部類)の全ての画像が一個ずつクリックしなくても、スライドショー風に見れます(画像の上にマウスポインターを持って行くと、左側に「←前」、右側に「次→」のリンクが見えてきますので、簡単にブラウズ出来る)。 常に「閉じる」も表示されますので、いつでもスライドショーを中止して、サムネールギャラリーに戻れます。

技術的な面に興味がある人は、Lightbox 2.0を検討してみて。

理由

画像がかなり増えてて、拡大画像を観たり、比べたりする為のクリック回数が多過ぎ… と言われました(笑)

以前の表示もシンプルで良かったけど、少し飽きてきて、もうちょっと格好良いめにしようと思いました。 Lightboxによってのスライドショーは結構 ナウくて格好良いし、マイクロソフトの糞インターネットエクスプローラにも対応してるから、ようやく決心が出来た。

画像を参考に出来る方法

今まで拡大画像が表示されたら、その新規ページのアドレスバーを見れば画像の名前もすぐ分かりました(URLアドレスの最後の4つの桁)のでメールでの問い合わせの時も「0123みたいなデザイン」の様な説明で、ギャラリーのサンプルも参考になりました。

今回、Javascriptによっての表示だからアドレスバーに画像の名前は出て来ないが、拡大された画像のすぐ下に「No.0123 •(画像についての説明等)」のように、各画像の番号が書いてあります。 コピー & ペースト出来る文ですから、今までと同じ画像の名前を参考にする事が出来ます。

そして、今までと同じ、サムネールの上にマウスポインターを重ねると、ブラウザウインドウの一番下にあるステータスバーにリンク先が表示されますので、クリックしなくても画像の名前(URLアドレスの最後の4つの桁)はすぐ分かると思います。

恐らく、画像を簡単にダウンロードする事が出来なくなりましたのでメールに添付する事は難しいが、画像の名前だけが分かったら充分です(画像をプリント、又はダウンロードしたい場合、下記の「新機能追加」を観て下さい)。

つまり、ギャラリーの画像を問い合わせの時に参考にしたい場合:

  1. サムネールの上にマウスを重ねて(クリックせず)、ブラウザウインドウの一番したのステータスバーを見て、表示されてるURLアドレスの最後の4つの桁をメールに書く。[Firefox, Safari, Camino and M$IE7.0 screenshots of the status bar]
  2. サムネールをクリックして、拡大画像が表示されたら、写真のすぐ下に「No.0123 •(画像についての説明等)」のように書いてあります。 その「No.0123」は見える画像の名前です。 コピー & ペースト等でメールに引用出来ます。
  3. Firefox、Mozilla、Netscape系のみ(Camino以外
    • 拡大画像が表示されたら、画像の上に右クリック(Macは「control」キーを押しながら普通のクリックでも出来る)でメニューを呼び出して、「画像を表示」、又は「画像のアドレスをコピーする」コマンドを選択して、マウスボタンを放す。 「画像を表示」を選択した場合、拡大画像が新規ページで見れるから、そのアドレスバーに画像のURLアドレスが表示されます。 「画像のアドレスをコピーする」を選択した場合、メールに切り替えて、ペーストをするだけで画像のURLアドレスを引用出来ます。

どうしても分からない人は、メール頂戴(笑)

新機能追加

画像をプリントしたり、ダウンロードしたりする事が出来る機能を追加しました。

各ギャラリーページの右側にあるリンクメニューの「画像参照」と言う検索フォームを使って、印刷、又はダウンロード可能な形で拡大画像が表示されます。

因に、上記の方法を使って画像の番号が分かったら、その4桁(半角文字)を検索欄に直接入力(又はペースト)し、送信すると拡大画像のみが見れます。 その画像を今までと同じ、プリントしたり、ダウンロードしたりする事が出来ます。

7件の書込みがあります

  1. 作業お疲れ様です。
    素晴らしい出来ですね!

  2. お疲れ〜ぃ!
    サンキューね! 結構 悩んでたけど、最終的に各画像の下に番号を付けると思い付いたら、一気に決心(笑) 不便だったら格好良いだけで足りないと思って、表示が奇麗でも問い合わせの際に参考にならなくなったらのはちょっと躊躇ったけどね…

    簡単にダウンロード出来なくなったのはちょっと短所だけど、近々 ダウンロードのやり方の説明も書こうと思ってる。 これで一石二鳥:ダウンロードも出来るし、色々なブラウザの裏技も「知ると楽」に載せれる(笑)

    後は英語サイトの方も方法を探さなきゃ。 あれはXHTML1.1(application/xhtml+xml)だからLightboxは対応しないから、Liteboxって言うバージョンにちょっとしたハックを加えれば出来るらしい… やってみた所は大失敗だったけど、諦める系じゃないからまたやってみると思ってる(笑)

    ———

    因に、InternetExplorerで確認出来る人が居たら、有り難いで御座る!
    BrowserCamを使って、WindowsXPのM$IE7.0で確認出来たけど もっと古いブラウザ、又は糞Vistaでまだ確認してない… 面倒臭くて(笑)

  3. Windows XPからも試してみました。
    InternetExplorer6.0、Firefox、Sleipnirで問題なくLightbox動きました。

    あと、「こういうのあったら良いなぁ」的な意見ですが、“該当の番号を入力すると、別画面で画像が表示される『画像専用の検索BOX』”なんかあったら、印刷もより手軽なんじゃないかと思います。
    いかがでしょうか?

  4. 色々なブラウザの確認は有り難う!
    異状無しで良かった(笑)

    提案についても了解!
    ちょっと考えてみる。 確かに、便利かも…
    画像の内容や名前で検索エンジンを作るのは結構 難しいけどね。 画像のファイル名は全部、番号になってるからキーワードは効かない。
    が、番号で別ウインドウに画像を呼び出すのは出来ると思う… 技術的にどうやって作るか全く思い付かないけど、ちょっと考えてみる。

    で、例えば、その検索欄をどこに置けば良いかな〜?
    各ギャラリーのページのどこか?

    流れとして、画像を観てから印刷したかったらその検索欄に数字を入れれば、拡大画像が出て来るはずでしょう?
    だったら、各ギャラリーの右のメニューとか、タイトルのすぐ下とかが良いかも…

    どう思う?

  5. 画像をプリント、またはダウンロードをする機能を追加しました。

    因にNoguさんの提案の通り、画像番号でプリント、及びダウンロード可能な拡大画像を検索するフォームを 各ギャラリーページの右側のリンクメニューに追加しました。

    思ったより簡単だった(PHPとシンプルなHTMLフォームを使って)のですぐ出来ました。

    Noguさん、良いアイディアで御座った!
    有り難う!

    ———

    屎インターネットエクスプローラでフォームがちゃんと表示されてるかどうか、未だ確認出来てないけど かなり簡単なCSSを使ってるから多分、大丈夫。

  6. 素早い対応で(笑)
    素晴らしいです。

    Win IE 6.0からも確認しました。問題ありませんでした◎

  7. 迷惑書込みが多くて管理が面倒臭ゐので、当スレッドの書込みを一時 休止させます。
    ゴキブリが他所行ったら、また開放します。