2015-11-28 4 views
-3

Я делаю простой сайт с wow.js/animate.css и на страницах, где я использую wow.js, анимация отстает и начинается немного позже, чем я ожидал. Если вы проверите это page, все экспонаты видны около 0,5 секунды, после чего начинается анимация. Это очень раздражает, как я могу это решить?«Отставание» анимации WoW на сайте

Я попытался установить контент невидимым по умолчанию и после полной загрузки страницы (document.ready), я изменю класс на видимый и добавлю класс «wow» в нужное содержимое.

Интересно, что если я использую, например, fadeIn/Out и т. д. вместо bounceIn, проблем нет.

Что я должен изменить, чтобы остановить «отставание» анимации wow на моей странице?

+0

это не обычная практика для пользователей на этом сайте для устранения неполадок с веб-сайтами. Код должен быть указан * в вопросе тела *, и рекомендуется [mcve]. – Claies

ответ

0

Вместо взлома существующий скрипт (ы), вы могли бы рассмотреть просто добавить загрузочную анимацию к документу ала ...

<!DOCTYPE html> 
<html class="no-js"> 
    <head> 
     <meta charset='UTF-8'> 

     <title>Simple Loader</title> 

     <style> 
      /* This only works with JavaScript, 
       if it's not present, don't show loader */ 
      .no-js #loader { display: none; } 
      .js #loader { display: block; position: absolute; left: 100px; top: 0; } 
     </style> 

     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 

     <script src="https://github.com/Modernizr/Modernizr/raw/master/modernizr.js"></script> 

     <script> 
      // Wait for window load 
      $(window).load(function() { 
       // Animate loader off screen 
       $("#loader").animate({ 
        top: -200 
       }, 1500); 
      }); 
     </script> 
    </head> 
    <body> 
     <img src="download.png" id="loader"> 
     <img src="//farm6.static.flickr.com/5299/5400751421_55d49b2786_o.jpg"> 
    </body> 
</html>` 

Источник: https://css-tricks.com/snippets/jquery/display-loading-graphic-until-page-fully-loaded/

+0

Обновлено с помощью фактического кода – JDQ

Смежные вопросы