1

ページが特定のウィンドウ幅を通過した後、基本的に一部のコンテンツをフェードインする関数を作成しようとしています。現在、以下のコードは、ウィンドウが 1775 ピクセル未満、1775 ピクセル、またはそれ以上にサイズ変更されるたびにフェードを実行します。ウィンドウの幅が 1775 ピクセルに達したときに一度だけコンテンツをフェードさせ、ウィンドウの幅が 1775 ピクセルを下回ったときにもう一度フェードさせたいと思います。

$(window).on('resize', function (event) { 
    if ($(window).width() >= 1775) {   
        $('.content-genre').hide().fadeIn(250);
} else {
    $('.content-genre').hide().fadeIn(250);
    }
});
4

2 に答える 2

0

私はあなたが求めていると思うことをするjsfiddleを作りました。見やすいように数字を変えてみました。1775 ではなく 800 でトグルします。

http://jsfiddle.net/eqrQS/4/

ここにjqueryがあります:

var toggle = $(window).width() < 800;
$(window).on('resize', function (event) {
    $('#text').text($(window).width());
    if ($(window).width() >= 800 && toggle) {
        $('.content-genre').hide().fadeIn(1000);
        toggle = false;
    } else if ($(window).width() < 800 && !toggle) {
        $('.content-genre').hide().fadeIn(1000);
        toggle = true;
    }
});

基本的に、私がしたことは、イベントがいつ発生したかを追跡するサイズ変更スコープの外に変数を作成することでした。これがあなたの求めているものでない場合はお知らせください。

于 2013-06-25T17:40:36.953 に答える