КАк найти на сайте «класс» и открыть его через 3 минуты после посещения пользователя?

Question

[symply_rabbit]

Как открыть автоматически форму с классом "city_chooser_small_frame" поставив ей класс show после 3х минут как человек на сайте?

пробовал

<script>


$(document).ready(function() {
  if ($.cookie('city_chooser_small_frame') == null) {
      $.cookie('city_chooser_small_frame', 'yes', { expires: 7, path: '/' });
      setTimeout(function(){
         $(".city_chooser_small_frame .show").foundation('reveal', 'open');
      }, 3000);
   }
});
</script>

и

<script>jQuery(function($) {
  // Ключ localStorage
  var LS_KEY = 'city_chooser_small_frame';
  
  // Если модал еще не открыали
  if (!localStorage.getItem(LS_KEY)) {
    setTimeout(function() {
      // Открываем модал
      modalShownFn();
      
      // Сохраняем флаг в localStorage
      localStorage.setItem(LS_KEY, '1');
    }, 3 * 1000);
  }
});</script>

Но ни один код не работает. как можно было бы решить данную проблему?

Answer 1

[Павло Пономаренко]

Оба кода выглядят правильными, но они настолько разные, что, я предполагаю, вы их нашли где-то и у вас не готово под них всё остальное. К примеру, для первого примера, не подключен Foundation, а для второго - не написана modalShownFn.

Единственно, что: 3000 - это 3 секунды. Для 3 минут должно быть 3 * 1000 * 60

И да, в примере $(".city_chooser_small_frame .show") вы не "ставите ей класс show". Подучите основы JQuery. Думаю, заработает так:

$(document).ready(function() {
  var KEY = 'city_chooser_small_frame';
  if ($.cookie(KEY) == null) {
      $.cookie(KEY, 'yes', { expires: 7, path: '/' });
      setTimeout(function(){
         $(".city_chooser_small_frame").addClass("show");
      }, 3000); // <== не забудьте тут правильное время
   }
});

Comments

[symply_rabbit]

Павло Пономаренко, не работает что-то. в стилях пишу

.show {
display: block!important;
}

это модальное окно готового решения вообще, может, не там пишу. стили к стилям шаблона сайта добавил. а скрипт в сам шаблон

[Павло Пономаренко]

symply_rabbit, о! А вы понимаете, что теперь у вас в браузере стоит кука и окно больше не показывается, пока вы эту куку не почистите?

[symply_rabbit]

Павло Пономаренко, я открываю с инкогнито:)

[Павло Пономаренко]

1. Посмотрите через инспект элемента, добавился ли класс. Если добавился, а элемент не появился - проблема в стилях
2. Если не добавился - поставьте брейкпоинт сперва внутри (а) $(document).ready, потом внутри (б) if ($.cookie(KEY) == null) { и потом внутри (в) setTimeout(function(){

Если брейкпоинт (а) не сработал - вы не подключили или неправильно подключили код
Если брейкпоинт (б) не сработал - неправильно используем $.cookie или инкогнито режим
Если брейкпоинт (в) не сработал - даже не знаю что сказать)

Вместо брейкпоинтов можно делать console.log, но это не так весело.

Ещё может быть опечатка в классе `city_chooser_small_frame`, скопируйте его с одного места и перенесите во все другие.

[Павло Пономаренко]

О! И скажите, есть ли в консоли ошибки

Answer 2

[symply_rabbit]

Павло Пономаренко, не могу и посмотреть:( не понятно где лежит это окошко. готовое решение, не могу найти где весь этот код. через писк не находит. этот класс я взял из инспектора кода, когда окошко уже открыто. пробовал у него убирать класс шоу, скрылось окошко, добавил руками класс шоу, добавилось окошко.
можно максимум, добавить код окошка, скопировав из инстпектора его на тест, и применять там...

Comments

[Павло Пономаренко]

Пробуйте с тремя брейкпоинтами