新方式の画像ポップアップ

新方式の画像ポップアップ方法をようやく取り入れる準備ができた。これまでのポップアップ画像はサムネイル画像をクリックすると新しいウインドウ若しくはタブが立ち上がる形式でした。だが、今度の方法は新しいウインドウが立ち上がる事なく画像がポップアップする。しかもポップアップした画像をドラッグする事により、8方向にグリグリ移動させる事ができる。画像をクリックする事でポップアップした画像を閉じる事ができる。

ただそれだけではない。ポップアップする時と閉じる時は、画像がアニメーションするかの様な動きをするのである。それでいながら何とCSSと外部JavaScriptで構成できる。そのため、ウェブコーディングにおいても問題ない。それも今回採用に踏み切った大きな理由でもある。

ブログでないホームページはもちろんの事、MT(Movable Type)においてもコンテンツ(記事)テンプレートで専用CSSを指定し、専用CSSとJavaScriptファイルをアップロードすれば個別ページで呼び出すだけである。JavaScriptが使えてサーバーに必要なファイルをアップロードできれば実装できる。ただ、無料ブログサービスですと使えない所が多いでしょう。

更にポップアップした画像の下に見出しを付ける事ができるため、従来登山サイトでは「アルバム」という別ページで説明していたのをポップアップ画像で説明する事ができる。そのため、別にアルバムページを作成する事なく本文ページにアルバム機能を実装できる。。従って別ページのアルバムを廃止していく方向である。

近々登山サイトに土曜日に登った山(八剣山)の記録をアップする事になるが、そこで新方式の画像ポップアップが初披露である。従来ポップアップする写真は360×240pxだったが、サーバー容量の拡大により720×480pxに拡大していく。既にアップしている山行・縦走記録にも順次適応していく。更には登山サイトのみならず、「ポトリス博物館」など他の運営サイトにも適応していく。

尚、今回の画像ポップアップシステムは以下のサイトで登録し、ダウンロード・インストールを行った。個人的な利用なら無料だが、商用ですと有料となるので注意したい。

「Highslide JS(英語)」



↓当コンテンツが役立ったという方はお願いします。↓
人気ブログランキングに参加しています。

| 作成日 2009年06月22日 23:49| コメント (0) | トラックバック (0)
このコンテンツのトラックバックURL

コメントを投稿

(今までここでコメントした事がない時は、コメントを表示する前に当サイト管理人の承認が必要になる事があります。承認されるまではコメントは表示されません。その時はしばらくお待ち下さい。)

名前:

メールアドレス:

URL:

この情報を登録しますか?

コメント: (スタイル用のHTMLタグが使えます)

人気ブログランキングに参加しています。
人気ブログランキングに
参加しています。

サイトメニュー
★ご利用ください
便利な短縮URL

短くしたいURLを下の窓に貼り付けて短縮実行ボタンを押してください。短縮後はブラウザの戻るボタンで戻ってください。
   

   

利用前に規約をご覧ください。

このシステムはあなたのブログにも【無料】で入れられます。
コムズリンクスタッフ: 新規スタッフ登録