Как вывести <div> с поздравлением?
Как можно изменить скрипт чтобы он выводил див не целый день, а только с определённого времени, например с 12 часов дня 30 декабря и до 24 часов 31 декабря выводилось с наступающим новым годом, а с 00:00:00 1 января просто с новым годом и до 24 часов 3 января, и что бы див выводился не только 23 февраля а по разным праздникам и менялся текст поздравления, например Рождество с 3 часов ночи 6.01 с наступающим а 7.01 с рождеством, и так далее, 18:00 22.02 плюс 23.02, 15:00 7.03 и 8.03 и так далее3
(function(date){ if(date.getDate() == 23 && date.getMonth() + 1 == 2 ) document.write('<div>23 февраля</div>'); }(new Date())) |
Вы же сами пишите, о наступающем, 23, дне металлурга, и прочих, а код пытаетесь писать в лоб - если равно 23 и плюс/минус... А что, для каждого праздника свой код в таком случае будет? Ну наверное же сначала нужно создать объект определяющий праздники, тексты поздравлений и условия их вывода, нечто типа:
{ номер месяца: { день: {старт: метка времени, продолжительность: часов, вывод: текст}, день: {старт: метка времени, продолжительность: часов, вывод: текст}, .... }, .... } И единственный код, проверяющий наличие в объекте текущего месяца и дня, и при наличие запускающее таймер в указанное время с указанной продолжительностью. |
я думала надо одно событие 'наступающий' (старт финиш)
второе событие 'наступивший' (старт финиш) старт может быть с точностью до часа а финиш всегда с точностью до числа |
вернее старт финиш текст-картинка
|
Что же вы сразу с головой да в конкретику, когда задачу свою представляете только как "Хочу, а как?". Какая разница чего вы хотите показать, картинку или текст, это разве определяющее главное в задаче? Это всего лишь "что", а нужно еще определить когда это "что" показать и нужно ли.
Должен быть единственный код, который обслуживает условия описывающие все праздники по единым правилам (параметрам), будь это хоть Христа праздник, хоть День работника торговли. А если у какого либо праздника есть своя "фишка", то у всех праздников это в условиях описано как false или вообще отсутствует, а тех у кого есть, то это либо, опять таки, по единому сценарию "фишек" выводится, либо это ссылка на индивидуальные функции. Вы не должны задумываться на тем равен ли день 23 или иному числу, вы должны искать этот день в описателе праздников, в котором хоть свой праздник учреждайте, или 8 марта начинайте праздновать с 23 февраля, по 1 сентября. Код при этом ни сколь не должен изменяться. Если бы пользователь зашел и вышел, достаточно было просто проверять - есть в описании, значит показали, или уже время закончилось и не показываем. Но он же может войти и шарахаться по страницам не смотря на то, что пора уже пить. А значит должен быть таймер сканирующий описатель праздников на наличие в нем свойства равного текущему времени. А найдя такое свойство, отображает поздравление, после чего уже не сканирует описатель, а трудится над тем когда закрыть поздравление. Опишите у себя вначале все составляющие своей задачи, определите что и как должно выполняться, напишите код выполняющий, а затем просто добавляйте в объект параметры для него. А то как-то не с той стороны вы заходите. |
Не знаю правильно ли это
(function(date){ if(date.getHours() >= 12 && date.getDate() == 30 && date.getMonth() + 1 == 12 && <= date.getDate() == 31 && date.getMonth() + 1 == 12) document.write('<div class="holidays">С наступающим новым годом !!!</div>'); else if(date.getDate() >= 1 && date.getMonth() + 1 == 1 && <= date.getDate() == 3 && date.getMonth() + 1 == 1) document.write('<div class="holidays">С новым годом !!!</div>'); else if(date.getHours() >= 15 && date.getDate() == 6 && date.getMonth() + 1 == 1 && <= date.getDate() == 6 && date.getMonth() + 1 == 1) document.write('<div class="holidays">С наступающим Рождеством !!!</div>'); else if(date.getDate() >= 7 && date.getMonth() + 1 == 1 && <= date.getDate() == 7 && date.getMonth() + 1 == 1) document.write('<div class="holidays">С Рождеством !!!</div>'); else if(date.getDate() >= 23 && date.getMonth() + 1 == 2 && <= date.getDate() == 23 && date.getMonth() + 1 == 2) document.write('<div class="holidays">С 23 февраля !!!</div>'); else if(date.getDate() >= 8 && date.getMonth() + 1 == 3 && <= date.getDate() == 8 && date.getMonth() + 1 == 3) document.write('<div class="holidays">С 8 марта !!!</div>'); }(new Date())) |
Цитата:
Ну я вам о чем рассказывал? Ну ежику же понятно, что ваш код расточителен. Вот так упрощенно (не буду я таймеров запускать и прочего делать), код должен не конкретное в куче условий проверять, а брать для проверки параметры описанные объектом для всех праздников, по одним и тем же правилам. <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <style> .holiday { text-align: center; } </style> </head> <body> <script type="text/javascript"> var holidays = { '3': { '8': {'start': 8, 'duration': 12, 'compliments': '<img src="https://s0.tchkcdn.com/g-lScF7M4CSF9uPeXq54QRNw/4/22014/640x640/w/0/792c2e17f080c8b4461a3467a34bdf9e_398733855.jpg">'}, '9': {'start': 12, 'duration': 2, 'compliments': 'Поздравление с Днем счастливых!'} } }, d = new Date(), m; if((m = holidays[d.getMonth()+1]) && m[d.getDate()]) { //можно записывать в сессионное хранилище условие (метку окончания показа) //и проверяя ее в ней, если она есть, сразу отображаем поздравление и запускаем таймер окончания //в противном случае запускаем таймер сканирующий время на соответствие началу старта поздравления //и при этом событии пишем метку окончания в сессию //конечное сравнение для старта, это m = m[d.getDate()]; if(d.getHours()>=m.start) { var b = document.createElement('div'); b.className = 'holiday'; b.innerHTML = m.compliments; document.querySelector('body').appendChild(b) } } </script> </body> </html> Код выполняющий объект описатель праздников никак не должен изменяться при добавлении новых праздников, удалении и прочем. Вы же пишите как поете о том, что вижу. Ну также нельзя подходить к решению задач. PS. И да, если под Блондинкой действительно женщина, то с праздником! |
laimas,
Спасибо большое, за поздравления... |
P. S. если кто-то в свободное время посещает в игре варвары(barbars) 'таву' и общий чат то должны меня знать под этим же ником...
|
Как правильно указать дату в такой строке
d = new Date(),если год со знаком минус, ну типа до н. э. |
Как правильно указать дату в такой строке
d = new Date(),если год со знаком минус, ну типа до н. э. |
ну с этим всё ясно
d = new Date(1970,0,1) вопрос как быть если речь идет о древних датах до н. э.? просто ставить год с минусом d = new Date(-1970,0,1) или как |
Цитата:
|
Цитата:
|
Цитата:
Цитата:
|
Цитата:
Время в JavaScript представлено при помощи класса Date, экземпляры которого хранят конкретное время. Время измеряется в миллисекундах, прошедших с 1 января 1970 года. И поскольку целочисленные значения Number представлены целыми числами от -9 007 199 254 740 992 до 9 007 199 254 740 992, то этого достаточно, чтобы измерять время с миллисекундной точностью на протяжении 285 616 лет от полуночи 1 января 1970 по Гринвичу, как в будущее, так и в прошлое. При помощи этого объекта можно представить любую зафиксированную дату из истории человечества. Однако у вас могут возникнуть вопросы:
Согласно спецификации EcmaScript, пункт 20.3.2.1, перегрузка конструктора класса Date, которая принимает хотя бы 2 аргумента, принимает в качестве аргументов числа, значение которых зависит от положения в списке аргументов: Date ( год, месяц [ , число [ , часы [ , минуты [ , секунды [ , миллисекунды ] ] ] ] ] ). Однако в том же разделе указано, что если год приведённый к целочисленному значению, является числом от 0 до 99, то год, представленный объектом Date, будет являться годом от 1900 до 1999 соответственно. Также в этой перегрузке второй аргумент представляет месяц, уменьшенный на 1. Также это локальное время. alert(new Date(2015, 8, 17)); // 17 сентября 2015 alert(new Date(65, 4, 5)); // 5 мая 1965 Строковое представление принимает любую дату по Гринвичу с 1 января 1 г. н. э. по 31 декабря 9999 г. н. э. в формате YYYY-MM-DD alert(new Date("0034-05-15")); // 15 мая 34 г. н. э. alert(new Date("0117-01-04")); // 4 января 117 г. н. э. Остальные даты представляются при помощи расширенного строкового представления: в виде приставки знака и двух дополнительных разрядов для представления года. alert(new Date("-000606-10-30")); // 30 октября 607 г. до н. э. alert(new Date("-000001-01-01")); // 1 января 2 г. до н. э. alert(new Date("+000000-01-01")); // 1 января 1 г. до н. э. alert(new Date("+000001-01-01")); // 1 января 1 г. н. э. alert(new Date("+001970-01-01")); // 1 января 1970 г. н. э. alert(new Date("+002019-03-26")); // 26 марта 2019 г. н. э. И ещё стоит учитывать, что нулевого года не существует. После 31 декабря 1 до н. э. идёт 1 января 1 г. н. э. |
Malleys,
:thanks: |
Malleys,
огромная благодарность тебе за столь подробные объяснения Цитата:
border-radius: 15px/10px 15px/10px 15px/10px 15px/10px;а на самом деле надо border-radius: 15px 15px 15px 15px / 10px 10px 10px 10px; |
Ладно, попробую задать вопрос по теме топика, возможно ли расчитать дату религиозных праздников, православных и католических пасхи и так далее, или проще будет взять уже готовые даты?
|
Цитата:
Вот я попробовал... <h4>Православная пасха</h4> <input id="input" type="number" value="2019"> <output id="output"></output> <script> function psh(Y){ var a = (19 * (Y % 19) + 15) % 30; var b = (2 * (Y % 4) + 4 * (Y % 7) + 6 * a + 6) % 7; if(a + b > 26) return (a + b - 26) + " мая " + Y; else return (a + b + 4) + " апреля " + Y; } (input.oninput = function() { output.textContent = psh(+input.value); })(); </script> UPD Что, теперь будете исследовать Метонов цикл? |
Цитата:
|
Malleys,
:victory: Оказывается строкой можно как. Еще бы разбор английской строковой нотации в метод parse добавили, было бы отлично. |
laimas,
можно ли определить местоположение пользователя с точностью до страны? |
Блондинка, можно по ip вычислить страну (не всегда верно), можно попробовать использовать GeoLocation API.
Как по широте и долготе получить страну пользователя гуглите. |
Цитата:
alert(new Date("15 December 2012 03:05:20 GMT+000") ); // глобальное время alert(new Date("15 December 2012 03:05:20") ); // локальное время alert(new Date("15 December 2012 GMT+000") ); // глобальное время alert(new Date("15 December 2012") ); // локальное время |
Malleys, ну это понятно, как и форматы RFC, я о другом, об относительных форматах, так можно запросить первую субботу текущего месяца - "first sat of now". Ну и тому подобные.
|
Nexus,
как можно догадаться из названия темы, вопрос в том как показать див с поздравлением например день независимости России Украины Белоруссии чтобы этот див был виден только жителям соответвующей страны а для жителей других стран этот див чтоб не выводился, надо что то простое, без вопросов-ответов посетителям о разрешении использования их геолокации, и в тоже время достаточно точное и надёжное. |
Цитата:
Но можно с точностью до города или страны, то можете посмотреть на этот сервис http://ip-api.com/ |
Цитата:
|
laimas,
это не важно, вряд-ли или нет, страны достаточно |
Цитата:
|
Цитата:
|
Никто не знает?
Цитата:
|
Цитата:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <style> .holiday { text-align: center; } </style> </head> <body> <script type="text/javascript"> var holidays = { '3': { '8': {'start': 8, 'duration': 12, 'compliments': 'С 8 марта !'}, '9': {'start': 12, 'duration': 2, 'compliments': 'Поздравление с Днем счастливых!'} }, '4': { '11': {'start': 8, 'duration': 12, 'compliments': 'С днём космонавтики !'}, '30': {'start': 12, 'duration': 2, 'compliments': 'с 30 апреля! ' } }, '5': { '1': {'start': 8, 'duration': 12, 'compliments': 'С 1 мая !'}, '9': {'start': 12, 'duration': 2, 'compliments': 'С 9 мая !' } } }, d = new Date(), m; if((m = holidays[d.getMonth()+1]) && m[d.getDate()]) { //можно записывать в сессионное хранилище условие (метку окончания показа) //и проверяя ее в ней, если она есть, сразу отображаем поздравление и запускаем таймер окончания //в противном случае запускаем таймер сканирующий время на соответствие началу старта поздравления //и при этом событии пишем метку окончания в сессию //конечное сравнение для старта, это m = m[d.getDate()]; if(d.getHours()>=m.start) { var b = document.createElement('div'); b.className = 'holiday'; b.innerHTML = m.compliments; document.querySelector('body').appendChild(b) } } </script> </body> </html> |
Цитата:
function psh(Y){ var a = (19 * (Y % 19) + 15) % 30; var b = (2 * (Y % 4) + 4 * (Y % 7) + 6 * a + 6) % 7; if(a + b > 26) return (a + b - 26) + " мая " + Y; else return (a + b + 4) + " апреля " + Y; } и вывести поздравление с пасхой, и радуницей(+9 дней) и эту функцию function catholicDate(year) { // [url]https://ru.wikipedia.org/wiki/Алгоритм_Гаусса_вычисления_даты_Пасхи[/url] var a = year % 19, b = year % 4, c = year % 7, k = Math.floor(year / 100), p = Math.floor((13 + 8 * k) / 25), q = Math.floor(k / 4), m = (15 - p + k - q) % 30, n = (4 + k - q) % 7, d = (19 * a + m) % 30, e = (2 * b + 4 * c + 6 * d + n) % 7; if (d === 29 && e === 6) return new Date(year, 3, 19); if (d === 28 && e === 6 && ((11 * m + 11) % 30 < 19)) return new Date(year, 3, 18); if (d + e > 9) return new Date(year, 3, d + e - 9); else return new Date(year, 2, 22 + d + e); } и вывести поздравление с католической пасхой? |
есть скрипт выводящий/скрывающий блок с поздравлениями...
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <style> div.holiday { background-color: #ececec; text-align: center; border: 1px solid #999; padding: 20px; color: #f00; font: bold 24px serif; } </style> </head> <body> <div id="holigay"></div> <script type="text/javascript"> var holidays = { '3': { '8': {'start': 8, 'duration': 12, 'compliments': 'С 8 марта !'}, '9': {'start': 12, 'duration': 2, 'compliments': 'Поздравление с Днем счастливых!'} }, '4': { '11': {'start': 8, 'duration': 12, 'compliments': 'С днём космонавтики !'}, '30': {'start': 12, 'duration': 2, 'compliments': 'с 30 апреля! ' } }, '5': { '1': {'start': 8, 'duration': 12, 'compliments': 'С 1 мая !'}, '9': {'start': 12, 'duration': 2, 'compliments': 'С 9 мая !' } } }, d = new Date(), m; if((m = holidays[d.getMonth()+1]) && m[d.getDate()]) { m = m[d.getDate()]; if(d.getHours()>=m.start) { var b = document.createElement('div'); b.className = 'holiday'; b.innerHTML = m.compliments; document.querySelector('body').appendChild(b) } } </script> </body> </html> в нем фиксированные даты, вопрос как вывести поздравления с праздниками, даты которых меняются каждый год? есть две функции для расчёта пасхи православной и католической function orthodoxDate(year) { var a = year % 19; var b = year % 4; var c = year % 7; var d = (19 * a + 15) % 30; var e = (2 * b + 4 * c + 6 * d + 6) % 7; var f = d + e; return f <= 26 ? new Date(year, 3, 4 + f) : new Date(year, 4, f - 26); } function catholicDate(year) { var a = year % 19; var b = year % 4; var c = year % 7; var k = Math.floor(year / 100); var p = Math.floor((13 + 8 * k) / 25); var q = Math.floor(k / 4); var m = (15 - p + k - q) % 30; var n = (4 + k - q) % 7; var d = (19 * a + m) % 30; var e = (2 * b + 4 * c + 6 * d + n) % 7; if (d === 29 && e === 6) return new Date(year, 3, 19); if (d === 28 && e === 6 && ((11 * m + 11) % 30 < 19)) return new Date(year, 3, 18); if (d + e > 9) return new Date(year, 3, d + e - 9); else return new Date(year, 2, 22 + d + e); } как в скрипт добавить эти функции, чтобы блок появлялся в эти даты пасхи православной католической, православной радуницей(+9 дней) и православной троицей(+49 дней) ? |
Часовой пояс GMT +3, время: 04:11. |