Як зробити спливаюче вікно на сайті з запуском по таймеру - onetwostudy - безкоштовні відео уроки

Підготовчі роботи

Для початку створимо базовий документ, де підключимо плагін Colorbox. який відповідає за створення модальних вікон на jQuery.

Як показувати спливаюче вікно на сайті не частіше одного разу на годину

Нам також варто подбати про наші користувачів і не показувати їм одне і теж вікно більше одного разу за годину (день, два дні, місяць).
Для цього потрібно зробити запис cookies в браузері користувача із зазначенням часу її життя. Ми будемо використовувати js-cookie. Підключати js-cookie потрібно після підключення Colorbox:

Для показу модального вікна раз на добу код буде наступним:

Cookies. set ( 'colorboxShown'. 'yes'. );

html. "

Call For a Free Quote

".

var popupShown = Cookies. get ( 'colorboxShown');

console. log ( "Cookie found. No action necessary");

lastFocus = document. activeElement;

Нижче ви бачите те, що у нас вийшло.
Через 10 секунд спливає модальне вікно з закликом. І це віконце показується користувачеві раз на добу.
Також ми додали кнопку з очищенням кук, щоб ви могли кілька разів подивитися на роботу демо.

Як зробити спливаюче вікно на сайті з запуском по таймеру - onetwostudy - безкоштовні відео уроки

У сьогоднішньому уроці ми розглянемо простий сниппет, який дозволяє дізнатися координати положення курсору щодо документа. ...

Як зробити спливаюче вікно на сайті з запуском по таймеру - onetwostudy - безкоштовні відео уроки

Як зробити спливаюче вікно на сайті з запуском по таймеру - onetwostudy - безкоштовні відео уроки

Сьогодні ми навчимося створювати популярне останнім часом рішення: фіксоване верхнє меню, яке змінюється при ...