質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

Q&A

0回答

1068閲覧

JqueryプラグインのSliderProのメソッドgotoslideを使うと次へボタンが効かなくなる

mikihuzi

総合スコア0

jQueryプラグイン

jQueryの拡張機能。 様々な種類があり、その数は膨大です。公開済みのプラグインの他にも、自作することもできます。 jQueryで利用できるようにしておくだけで、導入およびカスタマイズが比較的容易に行なえます。

0グッド

0クリップ

投稿2021/05/10 14:31

編集2021/05/10 14:35

前提・実現したいこと

Slider Proを使ったスライドで
gotoslideメソッドを使用して指定した画像を遷移させると
画像をスライドする次へのボタンが効かなくなるので聞くようにしたい

<div class="slider-pro sp-horizontal"> <div class="sp-slides-container"> <div class="sp-mask sp-grab"> <ul class="sp-slides"> <li class="sp-slide image-click sp-selected" data-index="0" data-init="true" data-loaded="true"> <div class="sp-image-container"> <img src="" class="sp-image" id="mainImg_1" data-default=""> </div> </li> <li class="sp-slide image-click" data-index="1" data-init="true" data-loaded="true"> <div class="sp-image-container"> <img src="" class="sp-image" id="mainImg_2" data-default="" > </div> </li> <li class="sp-slide image-click" data-index="2" data-init="true"> <div class="sp-image-container"> <img src="" class="sp-image" id="mainImg_3" data-default="" > </div> </li> </ul> </div> <div class="sp-arrows"> <div class="sp-arrow sp-previous-arrow" style="display: block;"></div> <div class="sp-arrow sp-next-arrow" style="display: block;"></div> </div> </div> </div> <div class="imagech">0</div> <div class="imagech">1</div> <div class="imagech">2</div>

Jquery SlideProの宣言

1 $(".slider-pro").sliderPro({ 2 width: '100%', 3 arrows: true, 4 slideDistance:0, 5 autoHeight:true, 6 fadeFullScreen:false, 7 autoplay:false, 8 buttons:false, 9 loop :false, 10 });

gotoslideメソッド

1 2 $(".imagech").click(function() { 3 var cnt = $(this).text(); 4 if(cnt != null && cnt !=""){ 5 $(".slider-pro").sliderPro("gotoSlide",cnt); 6 } 7 });

###言語
Html Jquery SliderPro

現状起こっている状態

gotoSlideメソッドを使ったってスライドの遷移までできております。
その後にスライドを横の次へ【>】ボタンでスライドの変更ができなくなっています
また、gotoSlideで0や2を選択したとき本来遷移できない場合の方向の矢印は消えるはずなのに
消えません。
例)0のブロックを選択した場合【<】は消えている(display:none)はずなのに表示(display:block)となっている

どなたか経験は有りませんでしょうか?

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問