부트 스트랩과 함께 animate.css 및 viewportchecker를 사용하는 방법

Question

웹 사이트에서 부트 스트랩을 사용하고 있지만 animate.css 및 viewportchecker를 사용하여이 http://www.web2feel.com/freeby/scroll-effects/index4.html과 같은 숨겨진 클래스를 추가 한 후에 모든 요소가 영구적으로 사라 지므로이 애니메이션을 만들 수 없습니다.

jQuery('.row.homeCats').addClass("hide").viewportChecker({ 
    classToAdd: 'visible animated fadeInDown', 
    offset: 100 
}); 

이 부트 스트랩 CSS와 같은 페이지이며, JS 파일은 내가 여러 요소에 숨겨진 클래스를 적용하려고 한 모든

에 게재되어 seenothing 수 있지만이 같은 결과를 얻을 수 http://goo.gl/AipVzD 포함되어 있습니다. 애니메이션은

Answer 1

부트 스트랩 숨겨진 클래스가 같은 요소 부트 스트랩없이 정상적으로 작동합니다

.hidden { 
display: none !important; 
visibility: hidden !important; 
} 

그래서 물론이 모든 것을 숨 깁니다. 그러나 animate.css에는 "숨겨진"클래스가 없습니다. 왜 네가 왜 그걸 필요로하는지 모르겠지만 뭔가 숨길 필요가 있다면 왜 네 자신의 수업을 만들어 보지 그래? 부 칙

귀하의 질문에 viewportchecker하지 animate.css에 대해 실제로 때문에

, 여기에 솔루션입니다 :

사용이 (편집) 귀하의 CSS

.hideme{ 
opacity:0; 
} 
.visible{ 
opacity:1; 
} 

이에 대한 당신의 js (편집 됨) :

jQuery('.row.homeCats').addClass("hideme").viewportChecker({ 
classToAdd: 'visible animated fadeInDown', 
offset: 100 
});