当页面来回跨越特定分辨率一次时，如何触发刷新/重新加载

Question

我有一个页面 www.redpeppermedia.in/tc24_beta/它在980px分辨率下工作正常，但是当您将其降低到768px时，CSS和媒体查询会更改它的布局，但是一旦您进入768px并刷新页面，一切都会像我想要的那样，布局会自行修复。现在，如果您尝试将其大小调整为超过 768px，则需要再次刷新，以便布局修复。

我的意思是有没有更好的方法可以做到这一点...或者任何人都可以帮我做这个刷新和重新加载的事情。.

非常感谢你，虽然:)

Answer 1

$（ window ）.width（）在jquery中浏览window.resize：

var old_size = $( window ).width();
$( window ).resize(function() {
  if(old_size > 768 && $( window ).width() < 768){
    window.location.reload();
  }
  old_size = $( window ).width();
});

Answer 2

我发现了这个惊人的脚本来完成我的工作：

$(document).ready(function(){
    var ww = $(window).width();
    var limit = 768;            
    function refresh() {
        ww = $(window).width();
        var w =  ww<limit ? (location.reload(true)) :  ( ww>limit ? (location.reload(true)) : ww=limit );
    }
    var tOut;
    $(window).resize(function() {
        var resW = $(window).width();
        clearTimeout(tOut);                 
        if ((ww>limit && resW<limit) || (ww<limit && resW>limit) ) {        
            tOut = setTimeout(refresh, 100);
        }
    });
});