7

このスライダーを作成しました (プラグインを使用したくありませんでした):

function slider(sel, intr, i) {
  var _slider = this;
  this.ind = i;
  this.selector = sel;
  this.slide = [];
  this.slide_active = 0;
  this.amount;
  this.selector.children().each(function (i) {
    _slider.slide[i] = $(this);
    $(this).hide();
  })
  this.run();
}
slider.prototype.run = function () {
  var _s = this;
  this.slide[this.slide_active].show();
  setTimeout(function () {
    _s.slide[_s.slide_active].hide()
    _s.slide_active++;
    _s.run();
  }, interval);
}
var slides = [];
var interval = 1000
$('.slider').each(function (i) {
  slides[i] = new slider($(this), interval, i);
})

私が抱えている問題は、最後のスライド(画像)の後にそれを取得する方法がわからないことです。最初のスライドに戻ります。今のところ、最後まで .hide と .show だけで、画像がない場合は再開しません。

誰かがコードの提案で私を助けてくれますか? . サイクルのように。

編集:スライダーのマークアップ

    <div class="small_box top_right slider">
        <img class="fittobox" src="img/home10.jpg" alt="home10" width="854" height="592">
        <img class="fittobox" src="img/home3.jpg" alt="home3" width="435" height="392">
        <img class="fittobox" src="img/home4.jpg" alt="home4" width="435" height="392">
    </div>
4

4 に答える 4

1

このフィドルリンクを見てください。これは、スライダーを循環的に作成するのに役立ちます。スライダーが最後の画像に到達すると、最初の画像から再開されます。

var index = $selector.index();   
if (index == (length - 1)) {   
    $('img').first().removeClass('invisible').addClass('visible');  
}

これがもっとお役に立てば幸いです。ではごきげんよう。

于 2013-03-07T10:56:14.780 に答える
1

ここで修正バージョンを作成しました

これを行う最も簡単な方法は、現在ある場所で簡単な数学演算を実行することです。

_s.slide_active++;

代わりに、取得_s.slide_activeし、追加1し、それをモジュラス(%)で全長に実行します。これにより、余りが得られます。

_s.slide_active = (_s.slide_active + 1) % _s.slide.length;
于 2013-03-07T12:50:42.937 に答える
0

length-1 の後に 0 になる必要があります。これを行う簡単な方法の 1 つは、モジュロ長さを使用することです。

_s.slide_active++;
_s.slide_active %= length;
于 2013-03-07T11:02:08.387 に答える
0

テストされていませんが、役立つことを願っています:

function slider(sel, intr , i){
   ...
   this.count = this.selector.children().length;
   this.run();
}

slider.prototype.run = function(){
    var _s = this;
    this.slide[this.slide_active].show();
    setTimeout(function(){
        _s.slide[_s.slide_active].hide()
        if(_s.slide_active == this.count)
             _s.slide_active = 0;  
        else
             _s.slide_active++;
        _s.run();
    }, interval);
}  
于 2013-03-07T11:18:14.950 に答える