0

ビューポートが 1250 ピクセル以上の場合に、現在 Web サイトに表示している Twitter フィードがあります。したがって、画面が十分に広い場合、何らかのコンテンツが呼び出されます (これは、twitter フィードの javaScript ファイルを呼び出します。

私の現在のコードはこれです...

function checkSize(){
    if ($(window).width() > 1250) {
        $(".tweet").load("/ajax/");
    }
}

checkSize();

$(window).resize(function() {
    checkSize();
});

これで問題なく動作しますが、twitter スクリプトがページの下部にあるため、ユーザー ビューに div が表示されたときにのみスクリプトをロードするにはどうすればよいですか?

私はこのようなことを試しましたが、うまくいきません

function checkSize(){
    if ($(window).width() > 1250 && $(".tweet").is(':visible'))  {
        $(".tweet").load("/ajax/");
    }
}

確認のために、画面幅が 1250px 以上で、ユーザーがページの下部にいるときにのみこのコンテンツを呼び出して、親 div が表示されるようにしたい (.tweet)。

どんな助けでも大歓迎です。

ここでテストするコードペンを追加しましたhttp://codepen.io/anon/pen/ezksD

4

2 に答える 2

0

が表示されているかどうかを確認するには、ユーザーがどれだけスクロールしたかを調べる必要があると思いますdiv。したがって、あなたができることは次のとおりです(モバイルからこれを書き、コードの構文エラーをチェックしませんでした):

var loaded = false;
var proximity = 0;

if (loaded == false){
 $(window).scroll(function () {
    var scrollBottom =   $(".tweet").offset().top - $(window).scrollTop();
    var windowWidth = $(window).width();
    if (scrollBottom <= proximity && windowWidth > 1250 && loaded == false)
    {
         $(".tweet").load("/ajax/");
         loaded = true;
    }
 });
}

お役に立てば幸いです。

于 2013-07-07T17:16:39.660 に答える
0

これにより、ユーザーが表示されるまでスクロールダウンしたかどうかが判断されます。

function checkSize(){
    if ($(window).width() > 1250 && $(".tweet").offset().top < $(window).scrollTop())  {
        $(".tweet").load("/ajax/");
    }
}
于 2013-07-07T17:17:14.430 に答える