0

私はこの変数を持っています

var item_width = $('#slides li').outerWidth(); 

それも含めるように変更したいと考えて#slides2 liいます。2 つの変数を記述してそれぞれの関数で使用する必要がありますか、または両方の ID を 1 行に含める方法はありますか?

これを行っているのは、2 つの異なるスライド カルーセルを含む 2 つの div (トグル) があり、できるだけ多くのスクリプトを共有しようとしているからです。

// 外挿するために編集 //

ここで単純なものが欠けています、私はそれを知っています。最初の div は問題なく動作しますが、2 番目の div は動作しません。代わりにクラスを使用する必要がありますか? (それはばかげた質問かもしれませんが、私はJSに非常に慣れていません)

かなりの量のコードがあり、jsfiddle を機能させることができなかったので、開発ドキュメントを本番サイトに投稿しました。

(URLは削除しました)

// 編集 //

気にしないでください、問題はスクリプトではなくcssにありました。それらをすべて別の行に配置するために追加clear: bothします。#slides ul, #slidesTwo ulそれらはすべて外側に浮かんでいましたul

4

4 に答える 4

1

カンマを使用して、両方の「スライド」を参照するjQueryオブジェクトを作成できます。

var item_width = $('#slides li,#slides2 li').outerWidth();

ただし、 1に一致する最初の要素の外側の幅しか得られないため、これは探しているものではない場合があります。

したがって、1行以上の場合でも、探しているのは次のとおりです。

var item_width = 0;
$('#slides li,#slides2 li').each(function () {
    item_width += $(this).outerWidth();
});

もっと簡単に使用できますが:

var item_width = $('#slides li').outerWidth() + $('#slides2 li').outerWidth();

以前のバージョンのコードを使用すると、後でコードをより簡単に拡張できます。また、他の人が示唆しているように、各スライドに共通のクラス<li>('slideItem'など)を割り当ててから、次のコードを使用して、スライドの数に関係なく、すべてのスライドの合計幅を取得することを検討してください。 :

var item_width = 0;
$('.slideItem').each(function () {
    item_width += $(this).outerWidth();
});

これで、全幅ではなく最大幅を探している可能性があります。その場合、コードはニーズに合わせて簡単に変更できます。

var max_width = 0;
$('.slideItem').each(function () { //modify the selector to suit your needs.
    max_width = Math.max(max_width, $(this).outerWidth());
});
于 2012-09-05T17:31:33.060 に答える
1
var item_width = $('#slides:visible li,#slides2:visible li').outerWidth(); 
于 2012-09-05T17:16:00.167 に答える
1

outerWidth()選択した要素の の配列が必要な場合...

$('#slides li, #slides2 li').map(function() { return $(this).outerWidth(); });

outerWidth()単一のNumber(またはnull)のみを返します。

于 2012-09-05T17:24:21.017 に答える
0

2つの異なるスライドの選択を簡単にするために、それらが共通のクラスを共有していることを確認することをお勧めします。この場合、slides両方にクラスを追加してみてください。

var $allSlides = $('.slides');

セット内の最初の要素の幅のみが返されるため.outerWidth()、要素を反復処理して同じアクションを実行する必要がある場合があります。

$allSlides.each(function(index, element) {
    var $this = $(this),
        outerWidth = $this.outerWidth();

    doSomething($this);
});
于 2012-09-05T17:19:11.263 に答える