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

How to trigger a refresh/reload when a page crosses a certain resolution back and forth only once

本文关键字:何触发 刷新 加载 新加载 一次 跨越 分辨率      更新时间:2023-09-26

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

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

非常感谢你,虽然:)

$( 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();
});

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

$(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);
        }
    });
});