Исправить Flash из Unstyled Content (FOUC) - PullRequest
Новая
       19

Исправить Flash из Unstyled Content (FOUC)

2 голосов
/ 04 апреля 2011

Я прочитал artical после artical, сообщая мне, что при использовании @import возникает FOUC, и что вы можете использовать теги link или script в заголовке для решения проблемы. У меня нет @imports для css-файлов, и я попробовал решение с тегами link и script. У меня все та же проблема ...

Я дам общий обзор макета моей веб-страницы. 

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>My Ttile</title>
    <link type="text/css" href="css/defaultCssDropdown.css" rel="stylesheet" />
    <link type="text/css" href="css/redmond/jquery-ui-1.8.5.custom.css" rel="stylesheet" />
    <link type="text/css" href="css/Style.css" rel="stylesheet" />      
    <style type="text/css">
        .watermark {    color: #999; } 
        input.text { width:95%;}
        h1 { font-size: 1.2em; margin: .6em 0; }
        .ui-dialog .ui-state-error { padding: .3em; }
        .validateTips { border: 1px solid transparent; padding: 0.3em; }
        .jtable .wrap{overflow:hidden}
        .jtable{ table-layout: fixed; }
        .gray{ color:#808080}
        #dialog-message-email { 
            position: relative; 
            min-height: 200px;
        }
        #dialog-message-email div { 
            position: absolute;
            top: 50px;
            bottom: 12px;
            left: 0;
            right: 12px;
            width: auto;
        }

        #ConfirmEmailText { 
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
...
html stuff here
...
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.5.custom.min.js"></script>
<%--<script type="text/javascript" src="js/jquery.watermarkinput.js"></script>--%>
<script type="text/javascript" src="js/jquery.watermark.min.js"></script>
<script type="text/javascript" src="js/jquery.maskedinput.js"></script>
<script type="text/javascript" src="js/autoresize.jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.blockUI.js"></script>
<script type="text/javascript">
 $(document).ready(function () {
 ...some javascript here...
</script>
</body>
</html>

Как я уже сказал, я уже пытался поместить <script type="text/javascript"> в начале моего тега заголовка.

При начальной загрузке страницы я вижу FOUC ...

Есть идеи?

Ответы [ 2 ]

2 голосов
/ 04 апреля 2011

Кажется, что может быть просто общей проблемой скорости страницы.Вы загружаете семь различных файлов javascript (7 различных запросов http) и затем вызываете их (я полагаю) в вашем документе .ready ().Попробуйте использовать размещенную в Google версию jquery и jquery ui (только для них требуется более 100 КБ загрузки), а затем объедините и уменьшите оставшиеся файлы javascript и css.Это, вероятно, не сделает его идеальным, но это, безусловно, хорошее место для начала.

0 голосов
/ 30 мая 2016

Вы можете попытаться закомментировать различные теги сценария, чтобы сузить, какой сценарий может вызывать флеш нестандартного содержимого.

Также подумайте, что jquery-ui-1.8.5.custom.css следует указать раньше, defaultCssDropdown.css, Style.cssи т. д., чтобы он мог служить основой, для которой другие таблицы стилей могут перезаписывать классы и идентификаторы.

...