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

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

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

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

このQ&Aに関連する最新のQ&A

A 回答 (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/#us …

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

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!


人気Q&Aランキング