こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

jQueryのスライドショーのカスタマイズについて

仕事であるサイトを作っているのですが、製品ページの所で製品画像をスライドショーにして実装しようと思っており、jQueryで理想に近いプラグイン(galleriaというものです)を発見したのですが、スライドショーの領域内でさらに拡大画像ができるようにしてほしいと言われ自分でカスタマイズしようとやってみましたがうまくできません。
皆様のお力をお貸しいただけないでしょうか。

■galleriaのプラグインを使ってカスタマイズする内容
galleriaのサイトからファイルをダウンロードし(http://galleria.aino.se/download/)メイン画像(サムネイルの上にある画像)内、もしくは外に「拡大画像」というボタンを設置し、クリックするとモーダルウィンドウで拡大画像が表示されるようにしたい。

■自分でうまくできないところ
このプラグインはサムネイル、もしくは左右にある矢印をクリックすると画像が変わる仕様になっており、「拡大画像」ボタンに今表示されているメイン画像を判別させて拡大画像を表示させる処理が必要となると思うのですが、うまくいきません。
モーダルウィンドウはthick.box(http://jquery.com/demo/thickbox/)を使って表示させています。

その他に、もっと簡単にできる方法など教えていただければ助かります。
よろしくお願いいたします。

投稿日時 - 2011-04-11 18:58:33

QNo.6661284

すぐに回答ほしいです

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

ANo.1

>スライドショーの領域内でさらに拡大画像ができるようにしてほしいと言われ~
『スライドショーの領域内で』だとすると、通常時がほぼ領域サイズに表示でしょうから、さらに拡大して部分拡大表示でスクロール移動のようなことがしたいのでしょうか?
でも、

>モーダルウィンドウはthick.boxを使って表示させています。
(確認していませんが)thisckboxだと、概ねwindowサイズに近い拡大ではありませんでしたっけ?
一方で、(↑)の『スライドショーの領域内』はwindowサイズより小さいのでは?

よくわかりませんが、thickbox風に拡大表示できればよいのであれば、ご提示のサイトのデモがそのようになっているので、もともとの機能に含まれているのではないかと思われます。
 http://galleria.aino.se/
右下の「PopoutImage」の機能か「fullscreen」のような動作では不足なのでしょうか?



documentation、APIなどをざっと見てみると、(英語がわからないので、拾い読み程度ですが)
 showLightbox()、hideLightbox()、.enterFullscreen()などなどのメソッドも用意されているようですし、
http://galleria.aino.se/docs/1.2/api/methods/#using-the-api

 extend( [ options ] )などもそろっていて、拡張にも配慮してあるみたいなので、最悪の場合にはこのあたりを利用して拡張すればよさそう。
http://galleria.aino.se/docs/1.2/options/extend/

投稿日時 - 2011-04-11 19:54:36

あなたにオススメの質問