Javascript.RU

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

Сложный скрипт скролла
Всем привет! Зашел значит в тупик в логике скрипта) На примере понятно до того момента как первый section затухает. Далее по логике следующий section делает fadeIn получает #first, при прокрутке вниз теряет его, и так до последнего. Не могу сообразить как написать условие, после того как анимация возвращает прокрутку вверх...
http://ofb3752.bget.ru/test.html

var windo = $(window);
  var blocktop = $('#blocktop');
  var animBlock  = $('#blocktop').offset().top;

  windo.scroll(function (){

   if (!blocktop.hasClass('fixed') && windo.scrollTop() > animBlock) {
    blocktop.addClass('fixed').data('top', animBlock);
   } else if (blocktop.hasClass('fixed') && (windo.scrollTop() < blocktop.data('top'))) {
    blocktop.removeClass('fixed');
   }

  });
   
  var firstSection = $('#first');
  var nextSection = firstSection.next();

  blocktop.scroll(function (){
    if ($(this).scrollTop() > (blocktop.height() / 2)) {
      $(firstSection).fadeOut().attr('id', '');
      var y = blocktop.animate({
        scrollTop: 0,
      }, 'fast');
    } else {
    }
  });
Ответить с цитированием
  #2 (permalink)  
Старый 02.03.2015, 13:36
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

Задать callback-функцию в параметрах анимации.
Ответить с цитированием
  #3 (permalink)  
Старый 02.03.2015, 13:51
hhh hhh вне форума
Профессор
Отправить личное сообщение для hhh Посмотреть профиль Найти все сообщения от hhh
 
Регистрация: 19.11.2013
Сообщений: 150

Спасибо, вышло.
только дальше второго сэкшена процесс не идет.
blocktop.scroll(function (){
    if ($(this).scrollTop() > (blocktop.height() / 2)) {
      $(firstSection).fadeOut().attr('id', '');
     blocktop.animate({
        scrollTop: 0,
      },
    'fast',
     function() {
        nextSection.fadeIn().attr('id', 'first');
     });
    } 
  });
Ответить с цитированием
  #4 (permalink)  
Старый 02.03.2015, 14:57
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

>как написать условие, после того как анимация возвращает прокрутку вверх

scrollTop: 0

Что не так? Хотели после того как scrollTop = 0, получили это, а то, что не все "тухнет", так анимация причем? Надо чтобы на протяжении ее от до что-то там тухло, так следите тогда за состоянием анимации - параметр step.
Ответить с цитированием
  #5 (permalink)  
Старый 02.03.2015, 16:23
hhh hhh вне форума
Профессор
Отправить личное сообщение для hhh Посмотреть профиль Найти все сообщения от hhh
 
Регистрация: 19.11.2013
Сообщений: 150

Спасибо, колбэк то самое. Немножко нашаманил и получилось. Хоть и по-дилетански)

var firstSection = $('#first');
  var nextSection = firstSection.next();

  blocktop.scroll(function (){   
  
    if ($(this).scrollTop() > (blocktop.height() / 2)) {
      $('#first').fadeOut().attr('id', '').addClass('next');
     blocktop.animate({
        scrollTop: 0,
      },
    'fast',
     function() {
        $('.next').next().fadeIn().addClass('next')
        .prev().removeClass('next').hide();
     });
    } 
    else if ($('section:last-of-type').hasClass('next')) {
      setTimeout(removeFixed, 1000);
    } 
  });

  function removeFixed() {
    $('#blocktop').removeClass('fixed');
  }


http://ofb3752.bget.ru/test.html
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
PHP/AJAX скрипт "Нaселение мoегo гoрoдa oнлaйн" rustik-yes Работа 2 01.12.2014 22:53
2 компьютера 1 хром и 1 скрипт Megatron13 Opera, Safari и др. 1 21.07.2013 19:12
Почему скрипт не работает с данными, которые вернул другой скрипт? Rooner jQuery 3 20.09.2012 14:56
Изменить скрипт Изучаю_JS Общие вопросы Javascript 0 12.02.2012 22:05
А как зделать скрипт, чтобы например скрипт 1 заменялся скриптом 2? yura371 Общие вопросы Javascript 3 06.01.2009 22:40