Я хочу вызвать функцию при загрузке, а также при изменении размера.
Есть ли лучший способ переписать это более компактно?
$('.content .right').width($(window).width() - (480));
$(window).resize(function(e) {
$('.content .right').width($(window).width() - (480));
});
Вы можете привязаться только к событию resize и запускать это событие автоматически при загрузке:
// Bind to the resize event of the window object
$(window).on("resize", function () {
// Set .right's width to the window width minus 480 pixels
$(".content .right").width( $(this).width() - 480 );
// Invoke the resize event immediately
}).resize();
Последний вызов .resize() запустит этот код при загрузке.
.resize? Это стандартное использование метода, поскольку в документации указано: Свяжите обработчик событий с событие JavaScript изменения размера или запуск этого события для элемента.
- person Sampson; 17.04.2013
.trigger и .resize оба из jQuery 1.0.
- person Sampson; 18.04.2013
Я думаю, что лучшим решением будет просто привязать его также к событию загрузки:
$(window).on('load resize', function () {
$('.content .right').width( $(this).width() - 480 );
});
Приятно заметить повторяющуюся логику и вместо этого разбить ее на функцию:
function sizing() {
$('.content .right').width($(window).width() - 480);
}
$(document).ready(sizing);
$(window).resize(sizing);
Я собираюсь объединить лучшие части двух других ответов. Сначала переместите повторяющийся код в функцию. Во-вторых, не загрязняйте глобальное пространство имен.
$(document).ready(function() {
var adjust_size = function() {
$('.content .right').width($(window).width() - 480);
};
adjust_size();
$(window).resize(adjust_size);
});
Я назвал функцию adjust_size, потому что предпочитаю глаголы для функций, ориентированных на действие.
Простой способ:
html:
<body onload="$(window).resize()">
javascript:
$(window).resize(function () {
...
});
