Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Неоднократная анимация (https://javascript.ru/forum/events/54242-neodnokratnaya-animaciya.html)

NaStyA128 10.03.2015 16:48

Неоднократная анимация
 
Есть вот такой код:
window.onscroll = function() {
    if(window.pageYOffset > 0){
      $('nav').addClass('nav');
      $('.nav').animate({
        'opacity':'1'
      },1000); 
    }else{
      $('nav').removeClass('nav');
    }
  };

После первой прокрутки вниз анимация срабатывает, после того как прокручу вверх, а затем снова вниз, уже не срабатывает. В общем работает только первый и единственный раз? Кто знает почему так и как это исправить?

laimas 10.03.2015 17:22

$('nav').addClass('nav').animate({opacity : 1},1000)...


Это как записать можно. А значение opacity определяется слассом 'nav' и оно менее 1?

рони 10.03.2015 18:15

NaStyA128,
window.onscroll = function() {
    window.pageYOffset ? $("nav").addClass("nav").animate({
        opacity: "1"
    }, 1000) : $("nav").css({
        opacity: "0"
    }).removeClass("nav")
};

danik.js 10.03.2015 19:31

<style>
nav{
  position: fixed;
  width: 100%;
  background: red;
  height: 10px;
  opacity: 0.1;
  transition: opacity 1s;
}
nav.nav{
  opacity: 1;
}
</style>
<body style="height: 500px">
<nav id="nav"></nav>
<script>
window.onscroll = function() {
    nav.classList.toggle('nav', window.pageYOffset > 0);
};
</script>


Часовой пояс GMT +3, время: 12:29.