5

私は2つの配列を持っています。1 つはナビゲーション用で、もう 1 つはページ上のパネル用です。配列は両方とも同じサイズです。1 つのパネルに 1 つのナビゲーション ボタン。このコードは機能しますが、一時変数を設定せずにこれを行うためのより良い方法があるはずです。

$('.footer-nav li').click(function()
{
  var temp = $('.footer-nav li').index(this);
  var tArray = $('.about-bgs li');
  $('.about-bgs li').fadeOut();
  $(tArray[temp]).fadeIn();  //This is the line in question!
});

テイカーはいますか?

4

2 に答える 2

2

への jQuery コールバックは、との$(selector).each(callback) 2 つのパラメーターを受け入れます。だからあなたは書くことができますindexelement

$('.footer-nav li').each(function(index, element) {
  element.click( function(evt) {
    $('.about-bgs li').fadeOut();
    $('.about-bgs li').get(index).fadeIn();
  }); 
});

しかし、リスト内のすべての要素(フェードアウト) と指定された要素 (フェードイン) の間にアニメーションの競合があるため、これは奇妙なコードのように思えます。期待通りにはいかないと思います。

一度に 1 つの要素しか表示されないように見えるので、現在表示されている要素のみをフェードアウトします (同じ要素を 2 回連続してクリックする必要があるとは言いません)。

var current = $('.about-bgs li').fadeOut();
var last = $('.about-bgs li .current');
if (current !== last) {
  last.removeClass('current').fadeOut();
  current.addClass('current').fadeIn();
}

DOM の読み込み時に、.current要素を指定してこの関数を実行する (またはそれに応じて CSS/JS をいじる) 必要があります。

于 2012-09-27T13:50:41.940 に答える
0

私はあなたがただ使うことができたはずだと思うtArray[$(this)].fadeIn()

編集:他のもの:あなたがすでに書いたようvar tArray = $('.about-bgs li');に、あなたはただ使うことができますtArray.fadeOut();

于 2012-09-27T13:52:12.423 に答える