画面の幅が800（モバイルデバイス）未満の場合はdivを完全に削除します

Question

だから私はaroundを探しています。私はこれで良い解決策を見つけることができません。 divを削除しようとしていますので、画面サイズがモバイルの大きさの場合は表示されません...表示されていないdivは表示されませんが、divにsetInterval関数があるので

• 私の画面がxピクセル
• 未満であるか、それはときの幅唯一の私のsetInterval関数を実行することが可能であるならば、私は完全にdiv要素を削除できます：STILだから私の質問は...各5秒を読み込みますx以上ですか？

ありがとうございました！

setInterval(function(){ 
$(".chatMessages").load("getMeddelanden.php"); 
},5000); 

Answer 1

これは簡単な実装です。とにかくsetintervalが実行され、動作しなければならないかどうかを確認します。divは特定のウィンドウ幅で隠されています。このロジックを修正して、関数ハンドラ、およびresizeイベントのデバウンスを行います。

function isMobilewidth() { 
    return $(window).width() <= 800; 
} 

$(window).on('resize', function() { 
    $('.chatMessages').toggle(isMobilewidth()); 
}); 

setInterval(function(){ 
    if (!isMobilewidth()) 
    $(".chatMessages").load("getMeddelanden.php"); 
},5000); 

Answer 2

あなたはCSSメディアクエリを使用することができます。

@media only screen and (max-width: 800px) { 
    div { 
     display: none; 
    } 
} 

あなたはjavascriptのに固執したい場合は、使用CSS @media rules DOM要素

Answer 3

の.offsetWidthプロパティを試してみてください。

@media (max-width: 800px) { 
    .div { 
     display:none; 
    } 
}​ 

https://fiddle.jshell.net/Luc2zrbd/

Answer 4

この場合、次のようにデバイスの画面幅を取得し、それに応じて操作を行うことができます。あなたがたsetIntervalを必要としないことがあり

var width = (window.innerWidth > 0) ? window.innerWidth : screen.width; 

Answer 5

、あなたは、デバイスの携帯電話上のページのロードにもトリガーされwindow.resizeであなたのテストをベースにすることができます モバイルビューポートの説明についてはこちらをご覧ください：

http://www.quirksmode.org/mobile/viewports2.html

window.onresize = function(){ 
// set your business here 

}