前提・実現したいこと
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)となっている
どなたか経験は有りませんでしょうか?
あなたの回答
tips
プレビュー