Нужно вызывать javascript-код:
- после загрузки страницы
- при изменении размеров окна браузера
Вот этот код работает для первого случая и почему-то не работает для второго:
$(function() {
$(window).resize(doSomethingUseful());
});
function doSomethingUseful() {
$('body').append('<div>Handler for .resize() called. ' + document.body.clientWidth + '</div>');
}
А вот этот работает для второго случая, но не работает для первого:
$(function() {
$(window).resize(function() {
$('body').append('<div>Handler for .resize() called. ' + document.body.clientWidth + '</div>');
});
});
См. два тестовых примера ниже - их можно скопипастить, сохранить и запустить.
Какой код будет работать для обоих случаев?
Дополнено из комментариев.
Тестовый пример 1:
<html>
<head>
<title>resize</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$(window).resize(doSomethingUseful());
});
function doSomethingUseful() {
$('body').append('<div>Handler for .resize() called. ' + document.body.clientWidth + '</div>');
}
</script>
</head>
<body>
<div>hello world :)</div>
<hr>
</body>
</html>
Тестовый пример 2:
<html>
<head>
<title>resize</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$(window).resize(function() {
$('body').append('<div>Handler for .resize() called. ' + document.body.clientWidth + '</div>');
});
});
</script>
</head>
<body>
<div>hello world :)</div>
<hr>
</body>
</html>