zaplata.ru Магазин готовых блогов под ключ.
Автонаполняемые сайты Wordpress
Всего на портале более 900 готовых, автонаполняемых сайтов с доменом и без.
Ежедневно покупается 6-7 готовых сайтов. Email: zaplata_ru@mail.ru Tg: https://t.me/fgsbankd

Как отключить анимацию WOW на мобильной версии сайта?

на сайте есть плагин Tabs Responsive он добавляет <link rel='stylesheet' id='wpsm_tabs_r_animate-css' href='https://.store/wp-content/plugins/tabs-responsive/assets/css/animate.css?ver=6.1.1' media='all' />

я отдельно добавляю на блоки например wow zoomIn animated

и у меня на сайте блок анимируется мне это нравится.

но я хочу отключить на мобильной версии (адаптация) как это сделать

Добавьте в ваш файл стилей (например, в style.css вашей дочерней темы) следующее:

@media (max-width: 767px) {
  .wow {
    visibility: visible !important;
    animation-name: none !important;
    -webkit-animation-name: none !important;
    animation-duration: 0s !important;
    -webkit-animation-duration: 0s !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

Или/И, если вы используете классы вроде .animated.zoomIn напрямую:

@media (max-width: 767px) {
  .animated {
    animation: none !important;
    -webkit-animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

Если вы хотите вообще не подключать animate.css на мобильных устройствах — это нужно делать через PHP (в functions.php), проверяя user-agent или viewport, но это сложнее и менее надёжно. CSS-подход предпочтительнее.

0 Комментарий
guest

Другие сообщения форума

Закрыть меню