スライドショーの画像にリンクがはれない。

質問

http://bxslider.com/examples/thumbnail-pager-1

上記のjsプラグインでＨＰのスライドショーを作っています。
一応、うまくできましたが。ソースの１２２行目
<li><img src="/images/730_200/tree_root.jpg" /></li>

この画像にリンクをはるために、 <li><a href="●●●●.html"<img src="/images/730_200/tree_root.jpg" /></a></li>

と入力してアップロードしなおすと、スライドショーができなくなります。

何がいけないのでしょうか。お願いします。

回答No.2

fujillin · ベストアンサー

スクリプトの内容を読むのは面倒なので、実験だけしてみました。

demoのＨＴＭＬほかをそのままコピーして…
拡大画像の方はul要素全体でスライドしているだけのように思えるので、そちらの画像にそれぞれリンクを付加えて試してみたところ、とりあえずはそのままリンクも機能するようです。
全ての条件で確認したわけではないので、不具合がでるのかどうかまではわかりませんが、リンクを設定しても動作するように思われます。

似たような記述がいろいろあるので、class="bx-viewport"内のものが拡大画像に該当すると思います。（念のため）

回答No.1

Taiyonoshizuku

<li><a href="●●●●.html"<img src="/images/730_200/tree_root.jpg" /></a></li>

これが質問する再にミスったのならこう直せばいいと思うけど

<li><a href="●●●●.html"><img src="/images/730_200/tree_root.jpg" /></a></li>
こうしてもリンクできないんだったらそういうプラグインだってこと。

プラグインの中身見てないけど、画像をクリックしたら大きい画像が変わるようになっているところを見るとクリックのイベントがプラグインによっていじられてるから、リンクを入れても働かないと思うよ。

だいいち、リンクをはっちゃったらクリックしたときにページ飛んじゃうと思うんだけど。
それでもやりたいならプラグインの改造が必要。

補足

ありがとうございます。
小さい画像をクリックすると上に大きい画像がでてきますよね。
その大きい画像をクリックすると、対象のページに移動できるようにすることができたら理想なのですが、
それが無理だと、僕のやろうとしているものができないので困っています・・・