Вы спите в потоке пользовательского интерфейса, который блокирует дальнейшую обработку (включая обновление экрана).
Если вам нужно задержать некоторый код, вы можете использовать PauseTransition , чтобы подождать в течение двух секунд и использовать его метод onFinished
для запуска остальной части вашего кода после ожидания.
Я думаю, вам просто нужно вызвать правильный селектор: body
verus html
. Рассмотрим следующий код:
$(function() {
$("body").append("<div class='windowWidth'>Window Width: " + $(window).width() + "px</div>");
function response() {
if ($(window).width() > 480 && $(window).width() < 768) {
$("body").css({
"background-color": "red",
color: "black"
});
} else {
$("body").css({
"background-color": "black",
color: "white"
});
}
}
response();
$(window).resize(function() {
response();
$(".windowWidth").html("Window Width: " + $(this).width() + "px");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
<p>Paragraph in Body</p>
</div>
Надеюсь, что помогает.