У меня вот какая задача.
Нужно что бы в блок появлялся в определенный день недели и в этот день был до определенного дня, при этом показывал время сколько осталось этому блоку "жить" а потом исчезал. К примеру в субботу до 20:00. Он появляется в субботу показывал сколько часов и минут осталось до 20:00 и после 20:00 исчезает до следующей субботы
И я это сделал.
Но!!! У меня таких блоков будет более 150 и у каждого будет свое время и день недели. И если делать так для каждого код будет невероятной длины.
Продолжение в следующем посте.
<!DOCTYPE html>
<html lang="en">
<head>
<style>
html{
font-family: 'Courier New', Courier, monospace;
}
.blok {
border: 1px #000 solid;
padding:20px;
margin: 20px;
}
.nazvanie {
color:tomato;
}
.line{
display: inline-block;
}
</style>
</head>
<body>
<p id="hours" class="line"></p>
<p id="dot" class="line">:</p>
<p id="minutes" class="line"></p>
<br>
<p id="current_weekday" class="line"></p>
<br><br>
<div class="blok" id="blok_1">
<div class="nazvanie">Собрание в Суббота</div>
<div class="nachalo">Начало в 20:00</div>
<div class="vremya">
<p class="statys"></p>
<p class="remains"></p>
</div>
</div>
<script>
// JavaScript Document
let localTime = new Date;
let hours = localTime.getHours();
let minutes = localTime.getMinutes();
let hoursInput = document.getElementById("hours");
let minutesInput = document.getElementById("minutes");
let statys = document.getElementsByClassName("statys")[0];
let remains = document.getElementsByClassName("remains")[0];
let current_weekday = document.getElementById("current_weekday");
let blok_1 = document.getElementById("blok_1");
let hoursOpen = 20;
let hoursClose = 21;
let oneMinuts = 60;
let rezult_1 = "";
let rezult_2 = "";
let day = localTime.getDay() + 1;
if( day == 1 ) DayofWeek = 'воскресенье';
if( day == 2 ) DayofWeek = 'понедельник';
if( day == 3 ) DayofWeek = 'вторник';
if( day == 4 ) DayofWeek = 'среда';
if( day == 5 ) DayofWeek = 'четверг';
if( day == 6 ) DayofWeek = 'пятница';
if( day == 7 ) DayofWeek = 'суббота';
function weekday(){
if(day == 1){
blok_1.style.display = "none";
}
if(day == 1){
blok_1.style.display = "none";
}
if(day == 3){
blok_1.style.display = "none";
}
if(day == 4){
blok_1.style.display = "none";
}
if(day == 5){
blok_1.style.display = "none";
}
if(day == 6){
blok_1.style.display = "none";
}
if(day == 7){
blok_1.style.display = "block";
function openCloseStatys(){
if(hours>=0&&hours<=20){
blok_1.style.display="block";
statys.innerHTML=`Начнется через`;
}
else if(hours>= 21)
{
blok_1.style.display = "none";
}
else if(hours >= 20){
statys.innerHTML = `Собрание идет`;
blok_1.style.display = "block";
}
}
openCloseStatys();
}
}
weekday();
function timeHours(){
if(hours>=0){
rezult_1 = hoursOpen - hours -1;
}
}
timeHours();
function timeMinuts(){
rezult_2 = oneMinuts - minutes;
if(rezult_2>=0&&rezult_2<=9){
rezult_2 = "0" + rezult_2;
}
}
timeMinuts();
function timeZero(){
if(minutes<=9){
minutes = "0" + minutes;
}
if(hours<=9){
hours = "0" + hours;
}
}
timeZero();
current_weekday.innerHTML = `${DayofWeek}`;
hoursInput.innerHTML = `${hours}`;
minutesInput.innerHTML = `${minutes}`;
remains.innerHTML = `${rezult_1} ${rezult_2}`;
</script>
</body>
</html>