FadeThis jquery

[radioactive68]

http://lwiesel.github.io/jquery-fadethis/

 

Там есть 2 параметра:

 

scrolledIn

default: null

Function to call when the element come in viewport. 

This function is always called, even if reverse is set to false.

 

scrolledOut

default: null

Function to call when the element go out of the viewport. 

This function is always called, even if reverse is set to false.

 

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

выше 2 параметра, первый как я понял "чтото" дополнительно делает когда блок видим а второй параметр это делает когда он уходит за пределы браузера

как мне вставить свою функцию в этот параметр так чтобы она срабатывала после появления блока? http://codepen.io/anon/pen/NPQqJb

Edited April 17, 2015 by radioactive68

[Great Rash]

http://codepen.io/GreatRash/pen/qEeRjz

[radioactive68]

Great Rash, спасибо, не знал как функцию вставить правильно в опции плагина fadethis

 

В продолжение темы...

сделал такую конструкцию, но т.к в js не силен не могу понять причину странного поведения центрального блока этой конструкции 

http://cssdeck.com/labs/bcdnmpfp

 

иногда если крутануть несколько раз вверх в низ страницу то средний блок "RECRUITMENT" не пропадает и крайние раздвигаются на его фоне

http://data3.floomby.com/files/share/15_4_2015/0/Zo09Zb4tE2CruygCZAJ6Q.jpg

 

Я так понимаю нужно какоето условие при котором главная функция не начнёт свое "путешествие" пока не закончится её прошлое "выступление"

может кто помочь?

Edited April 15, 2015 by radioactive68

[Great Rash]

У меня ваш пример не работает вообще. Подозреваю, что из-за того, что вы неправильно подключаете внешние скрипты в codepen.io, чтобы подключить внешний скрипт нажмите иконку шестерёнки во вкладке JS.

 

[radioactive68]

Создал на другом http://cssdeck.com/labs/bcdnmpfp

[Great Rash]

Вам нужно завести переменную-флаг, если она равна true, значит анимация ещё в процессе и не нужно ничего делать. Что-то типа того:

var isAnimated = false;$(element).fadethis({  scrolledIn: function() {    if (!isAnimated) {      isAnimated = true;            setTimeout(function() {        // ...                isAnimated = false;      }, 300);    }  }});

[radioactive68]

что то никаких изменений.. может я что то не так сделал?

http://cssdeck.com/labs/bcdnmpfp

[Great Rash]

Ну на scrolledOut тоже самое надо сделать.

[radioactive68]

темнеменее результат тотже

http://cssdeck.com/labs/bcdnmpfp

http://data3.floomby.com/files/share/16_4_2015/16/f3DJ6a0ZOUSrrBmRqAYgw.jpg