Запуск функции JavaScript перед загрузкой страницы (установка фона соответствующего размера) - PullRequest
Новая
       7

Запуск функции JavaScript перед загрузкой страницы (установка фона соответствующего размера)

7 голосов
/ 23 октября 2010

У меня есть фоновое изображение, содержимое которого я хочу всегда видеть, независимо от разрешения пользователя.Поэтому я хочу иметь возможность определить, какое разрешение и установить соответствующий файл фонового изображения перед загрузкой страницы, в самом начале.Возможно ли это как-то?

Ответы [ 4 ]

10 голосов
/ 23 октября 2010

Самая ранняя точка, в которой вы можете запустить функцию Javascript с доступом к DOM (без ожидания загрузки страницы), - это размещение тега <script> сразу после открывающего тега <body>.

Сценарии внутри <head> будут выполняться до того, как это произойдет, но доступ к элементам на странице не будет.

Попробуйте этот код 

<body>
    <script type="text/javascript">
        alert("Some elements shouldn't even be visible when this shows");
    </script>
    ... rest of the page
</body>

См. пример с небольшим количеством Gangsta Lipsum текста.

1 голос
/ 23 октября 2010

Проверьте эту статью о получении разрешения экрана в Javascript: http://andylangton.co.uk/articles/javascript/browser-screen-resolution/

Теги скрипта выполняются встроенными, если вы не делаете ничего особенного, чтобы отложить их (а откладывание выполнения скрипта поддерживается не во всех браузерах) Это означает, что тег сценария, вложенный непосредственно в тег body, будет выполнен до загрузки остальной части тела. Вы можете заставить свой скрипт определить разрешение экрана и установить фоновое изображение для тела прямо здесь.

0 голосов
/ 23 октября 2010

Я понимаю, что вы специально спрашиваете о JavaScript, но есть довольно приличный способ сделать это с помощью CSS (и, возможно, немного JavaScript), описанный на сайте CSS Tricks.

0 голосов
/ 23 октября 2010

Используя JavaScript-фреймворк, такой как MooTools , вы можете использовать событие DomReady вместо onLoad (который ожидает загрузки всех элементов изображения), которое вы можете запустить при загрузке страницы. .

В качестве альтернативы с помощью CSS вы можете расположить абсолютный верхний левый угол и ширину: 100%, чтобы выиграть день. : O

...