Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.03.2015, 15:48
Новичок на форуме
Отправить личное сообщение для NaStyA128 Посмотреть профиль Найти все сообщения от NaStyA128
 
Регистрация: 10.03.2015
Сообщений: 1

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

После первой прокрутки вниз анимация срабатывает, после того как прокручу вверх, а затем снова вниз, уже не срабатывает. В общем работает только первый и единственный раз? Кто знает почему так и как это исправить?
Ответить с цитированием
  #2 (permalink)  
Старый 10.03.2015, 16:22
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

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


Это как записать можно. А значение opacity определяется слассом 'nav' и оно менее 1?
Ответить с цитированием
  #3 (permalink)  
Старый 10.03.2015, 17:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 31,984

NaStyA128,
window.onscroll = function() {
    window.pageYOffset ? $("nav").addClass("nav").animate({
        opacity: "1"
    }, 1000) : $("nav").css({
        opacity: "0"
    }).removeClass("nav")
};
Ответить с цитированием
  #4 (permalink)  
Старый 10.03.2015, 18:31
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

<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>
__________________
В личку только с интересными предложениями
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Анимация gif картинки при нажатии на ссылку ainur777 Общие вопросы Javascript 2 06.07.2014 15:23
CSS анимация после :target gJam (X)HTML/CSS 0 01.08.2013 21:42
Анимация в real-time приложениях(Нужны советы) ak-o AJAX и COMET 5 05.04.2013 10:34
Анимация. Помогите понять почему не работает. kadurban jQuery 4 08.07.2010 19:50
Цикличность анимация? SashaBorandi jQuery 1 25.12.2008 08:20