
http://bxslider.com/examples/thumbnail-pager-1
上記のjsプラグインでHPのスライドショーを作っています。
一応、うまくできましたが。ソースの122行目
<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ベストアンサー
- 回答日時:
スクリプトの内容を読むのは面倒なので、実験だけしてみました。
demoのHTMLほかをそのままコピーして…
拡大画像の方はul要素全体でスライドしているだけのように思えるので、そちらの画像にそれぞれリンクを付加えて試してみたところ、とりあえずはそのままリンクも機能するようです。
全ての条件で確認したわけではないので、不具合がでるのかどうかまではわかりませんが、リンクを設定しても動作するように思われます。
似たような記述がいろいろあるので、class="bx-viewport"内のものが拡大画像に該当すると思います。(念のため)
No.1
- 回答日時:
<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>
こうしてもリンクできないんだったらそういうプラグインだってこと。
プラグインの中身見てないけど、画像をクリックしたら大きい画像が変わるようになっているところを見るとクリックのイベントがプラグインによっていじられてるから、リンクを入れても働かないと思うよ。
だいいち、リンクをはっちゃったらクリックしたときにページ飛んじゃうと思うんだけど。
それでもやりたいならプラグインの改造が必要。
この回答への補足
ありがとうございます。
小さい画像をクリックすると上に大きい画像がでてきますよね。
その大きい画像をクリックすると、対象のページに移動できるようにすることができたら理想なのですが、
それが無理だと、僕のやろうとしているものができないので困っています・・・
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- PHP 共通の処理をまとめる方法がわからないのでアドバイスお願いします。 1 2022/12/19 20:20
- HTML・CSS htmlについて質問です! 写真のように写真の部分が?になってしまいます。 ファイルもしっかり選べて 1 2023/07/09 21:17
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
- HTML・CSS htmltとcssの連携をして画像縮小について 1 2022/11/15 20:32
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- Perl RSSにdiv,ul classを付けたいのですがどのようにつけるのかわからないです 2 2022/03/28 01:53
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
jQueryでタブ、スライダーを使...
-
スライドショー「Skitter」をカ...
-
【jQuery】2分割レイアウトで、...
-
Slick.jsのオプションrtlについて
-
初心者です jQueryのマウスオ...
-
html5に変えるとスライドショー...
-
qtipの使い方について
-
MAX関数を使ってからLEFT JOIN...
-
window.openで値の渡し方を教え...
-
jspでcssが読み込めない
-
jQueryで同じid属性が複数あっ...
-
CSS のみのタブ切り替えについて
-
c++std::string型をTCHARに変換...
-
JavaScriptで変更した属性の元...
-
多階層ドロップダウンのスマホ...
-
離れた場所にマウスオーバーで...
-
amazonの動画について
-
1枚の画像をクリックすると複数...
-
Vb.net2005での画像の合成方法
-
チェックボックスに入っている...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Slick.jsのオプションrtlについて
-
横並びの画像を3枚時間差でフェ...
-
順番にクラスをつけていく方法
-
【jQuery】2分割レイアウトで、...
-
キャラクターがぴょこんと飛び...
-
アコーディオンメニューが開い...
-
[jQuery]bxSlider 一番最後と...
-
同一ページ内の複数のタグに同...
-
画像をフェードアウト&フェー...
-
チェックボックスで画像を一括表示
-
Javascriptを使用したスライド...
-
CSSでマウスオーバーした画像を...
-
ツリーメニューの画像表示について
-
スライドショーの画像にリンク...
-
【iOS及びAndroid】リンク画像...
-
javascript src書き換え
-
一定時間ごとに画像を切り替え...
-
チェックボックスと画像切替の連動
-
liの数によってulの横幅を動的...
-
楽天APIのデータをjqueryのgetJ...
おすすめ情報