0

スライドが変更されたときに現在のページャーが別の画像に変更されるように、カスタム画像を使用してページャーを作成する方法を教えてください。

次の例では、別のスライドがアクティブになったときにサイクル ページャーの画像を変更します。

<div class="cycle-pager">


<img src="images/play.png">
<img src="images/cafe.png">
<img src="images/party.png">
</div><!---end cycle-pager------>



<div  class="cycle-slideshow"
data-cycle-fx=scrollHorz
data-cycle-pager=".cycle-pager"
data-cycle-pager-template=""

>
<img src="images/img1.png">
<img src="images/img2.png">
<img src="images/img3.jpg">
</div>

どんな助けでも大歓迎です！

4

1 に答える 1

0

私は私の問題を解決しました！

他の誰かが私と同じ問題に遭遇した場合に備えて、これが私がしたことです..

.cycle-pager-active クラスを作成し、css でできる限り低い不透明度を設定しました。次に、cycle-pager の位置を絶対位置に設定し、ページャー全体の高さと幅を合わせた背景画像を指定しました。

.cycle-pager-active {
   background:white;
   opacity:.10;
filter:Alpha(opacity=10);
}
.cycle-pager {
width:157px;
height:471px;
float:left;
background-image:url(../images/selector.jpg);
position:absolute;

}
于 2014-01-10T20:19:58.467 に答える