Неоднократная анимация
Есть вот такой код:
window.onscroll = function() { if(window.pageYOffset > 0){ $('nav').addClass('nav'); $('.nav').animate({ 'opacity':'1' },1000); }else{ $('nav').removeClass('nav'); } }; После первой прокрутки вниз анимация срабатывает, после того как прокручу вверх, а затем снова вниз, уже не срабатывает. В общем работает только первый и единственный раз? Кто знает почему так и как это исправить? |
$('nav').addClass('nav').animate({opacity : 1},1000)... Это как записать можно. А значение opacity определяется слассом 'nav' и оно менее 1? |
NaStyA128,
window.onscroll = function() { window.pageYOffset ? $("nav").addClass("nav").animate({ opacity: "1" }, 1000) : $("nav").css({ opacity: "0" }).removeClass("nav") }; |
<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. |