Geek asks and answers

Pure progressive improvement

I am using progressive enhancement to create a website. This menu, slide show, etc. Elements are included in the page as unordered lists, then JavaScript applies formatting.

My concern: how can I avoid a flash of unformatted content where unordered lists are visible before formatting? Are there any better methods for doing this?

Important: the site must remain friendly and accessible for SEO (which is why I use progressive improvement in the first place). Therefore, for example, the initial style of unordered lists cannot be specified: none.

+3
source share
2 answers

, , : none.

display: none, , JavaScript CSS script, , :

<head>
    <style type="text/css">
        body.withjs #menu { display: none; }
    </style>
</head>
<body>
    <script type="text/javascript">
        document.body.className= 'withjs';
        window.onload= function() {
            ...do stuff with menu...
            document.getElementById('menu').style.display= 'block';
        };
    </script>
    ...
    <ul id="menu">
        ...
    </ul>
</body>
+1

CSS JavaScript.

+2

More articles:


All Articles