0

問題 flexslider カルーセルを使用して多数の画像を表示します。私が今欲しいのは、ブラウザが特定の幅を持っているとき、たとえば768pxに付随する2つの画像が表示される休憩です。現在、特定の幅の半分の画像が表示されており、javascript / jquery を使用してこれらのポイントを表示し、そこに完全に表示する必要がある多くの画像を表示したいと考えています。

だから私の質問は、ブラウザーの幅がたとえば 768px の幅の場合に if ステートメントを作成するには、2 つの画像を表示する必要があるということです...

$('.flexslider').flexslider({
    animation: "slide",
    animationLoop: true,
    itemWidth: 320,
    itemMargin: 0,
    minItems: 2,
    maxItems: 5,
    start: function(slider){
        $('body').removeClass('loading');
    }
});

JSFiddleでコードを確認する

4

1 に答える 1

0

次のような幅の if ステートメントを使用できます。

if ($(window).width() < 960) {
   alert('Less than 960');
}
else {
   alert('More than 960');
}

...そしてそれを含めるために、ドキュメントの準備ができた関数とウィンドウのサイズ変更関数を組み合わせたいと思うかもしれません。

$(document).ready(myfunction);
$(window).resize(myfunction);

function myfunction() {
    // Pace the if/else here, do whatever
}

2 つの画像を表示するという点では、flexslider 関数または css でスラ​​イドの幅とオフセットを設定することで実現できるはずです。ここに私が話しているオプションがあります：

itemWidth: 490, // or whatever is 1/2 of your width
itemMargin: 30, // experiment here!
minItems: 1, // or 2

JS フィドル デモの編集バージョンを次に示します。http://jsfiddle.net/tM2a8/

于 2013-09-06T18:54:17.253 に答える