1

当我加载我的页面或调整浏览器窗口的大小时，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";
}
4

2 回答 2

0

您到底想用所有这些 javascript 做什么？如果您仅使用它来调整网页大小，则无需任何脚本即可轻松完成。

只需在 css 中执行此操作：

body { min-width: /*Smallest window size in pixels that don't mess up page*/px; }

您应该始终避免将脚本用于无需它即可轻松完成的事情。这减少了加载时间，降低了页面的内存大小，并减少了调试量。

于 2012-06-23T16:00:08.170 回答
0

我相信你可以在没有任何代码的情况下用 css 做所有事情......

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

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

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

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

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

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

我仍然相信您根本不需要这样做，您可能可以在纯 css 中完成所有操作而无需任何技巧。

于 2012-06-23T17:51:42.847 回答