gpt4 book ai didi

css - OnLoad 和调整大小 css 中断

转载 作者:太空宇宙 更新时间:2023-11-03 19:03:45 28 4
gpt4 key购买 nike

当我加载我的页面或调整浏览器窗口大小时,css 有加载延迟,用户可以看到没有格式化的页面。这是我的网站:bit.ly/MbyWss

这是我的代码:

我在html中的原始css是estilos_def.css

<body id="body" onresize="start();" onload="start();">

当 body 加载或调整大小时,我调用函数 start

var navWidth, navHeight;
function start(){

if (self.outerWidth != undefined)
{
navWidth = self.outerWidth;
navHeight = self.outerHeight;
} else {
navWidth = document.documentElement.clientWidth;
navHeight = document.documentElement.clientHeight;
}
//Problema com deteçao de width, resolve-o

if(navWidth>=1600){ //1600 - 1920
document.getElementById("estA").href="style/estilos_ws.css"
document.getElementById("titulo_dias").style.height= "10%";

}else if(navWidth > 1300 && navWidth <1600){ //1300 1600
document.getElementById('estA').href="style/estilos_1920.css";
document.getElementById("titulo_dias").style.height= "7%";

}else if(navWidth >= 1024 && navWidth <=1300){ //1024 - 1280
document.getElementById("estA").href="style/estilos_def.css"
document.getElementById("titulo_dias").style.height= "7%";

}
lbeats();

if(navigator.appName =='Microsoft Internet Explorer')
{
ie();
}
document.getElementById("dias").style.display="none";
document.getElementById("gal").style.display="none";
}

最佳答案

我相信你可以在 css 中做任何事情而无需任何代码...

但如果出于某种原因这是必须的,请在打开的页面上预加载所有 css 文件,将它们从页面中删除,然后在调整大小时重新添加需要的文件,这些文件将从未下载的缓存中使用。

另一种方法是将所有样式保存在一个 css 文件中,并将每个样式中的所有样式绑定(bind)到分配给 body 的某个类名,例如,如下所示:

    /* Sheet 1*/
.bodySheet1 div.Main {}
.bodySheet1 .img1 {}

/* Sheet 2*/
.bodySheet2 div.Main {}
.bodySheet2 .img1 {}

/* Sheet 3*/
.bodySheet3 div.Main {}
.bodySheet3 .img1 {}

而不是激活每个工作表,只需为正文分配正确的类名

我仍然相信你根本不需要这样做,你可以在没有任何技巧的情况下用纯 css 完成这一切。

关于css - OnLoad 和调整大小 css 中断,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11156966/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com