У меня есть эти два скрипта на моем сайте. Первый заставляет секцию #top исчезать при прокрутке из области просмотра, в то время как второй скрипт заставляет #top изменять цвет фона в зависимости от времени дня.
Первый скрипт работал идеально, пока я не добавил второй.
<script type="text/javascript">
$(document).ready(function () {
$(window).scroll(function () {
if ($(document).scrollTop() > 1) {
$("#top").addClass("scrolled");
} else {
$("#top").removeClass("scrolled");
}
});
});
</script>
<script type="text/javascript">
var now = new Date();
var hours = now.getHours();
// 1:00 AM to 6:00 AM
if (hours > 1 && hours < 6) {
document.getElementById("top").style.backgroundColor = "#feed9f"
}
// 7:00 AM to 12:00 PM
else if (hours > 7 && hours < 12) {
document.getElementById("top").style.backgroundColor = "#fee36c"
}
// 1:00 PM to 6:00 PM
else if (hours > 13 && hours < 18) {
document.getElementById("top").style.backgroundColor = "#fdda3a";
}
// 7:00 PM to 12:00 AM
else if (hours > 19 && hours < 24) {
document.getElementById("top").style.backgroundColor = "#fdd007";
}
</script>
В данный момент первый скрипт находится в <head>, а второй находится внизу <body> (работает только так).