테스트 사이트 - 개발 중인 베타 버전입니다

부트스트랩관련... 채택완료

쥬노 8년 전 조회 3,429

안녕하세요....부트스트랩으로 홈페이지를 제작하다가...궁금하게 있어서요...

http://leevi.co.kr/">http://leevi.co.kr/ 사이트처럼 페이지를 내릴때

해당 콘텐츠들이 그냥 보이는게 아니라 애니메이션 효과를 가지고 나타나는데요...

이거는 어떤기술인지요...

아니면 참고사이트나 배울수 있는 사이트, 등등 자료를 찾을 수 있는 곳을 알려주심

정말 감사하겠습니다....

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

쥬노
8년 전
님아....솔직히 님 말씀하시는게 잘 이해가 안가는데요.
조금만 더 풀어서 설명해주시면 안되나요?
죄송합니다...
스아이
8년 전
@쥬노 님 돼지코구뇽님 글을 자세히 보시면

'해당 소스는 오픈소스로 링크를 통해 더많은 효과를 확인하실수 있습니다.'
옆에 < 더많은자료보기 > 버튼이 있습니다.

https://daneden.github.io/animate.css 이 오픈 소스를 말한거구요.

댓글을 작성하려면 로그인이 필요합니다.

스아이
8년 전

아무래도 초보이시군요,,


부트스트랩으로 표현하는 기술은

css3와 js를 이용하는걸로 알고있습니다.


자바스크립트는 기본으로 하시고 이해를 하셔야할것같아요~


첫번째.

$('body')[0].scrollTop (현재 스크롤 위치) 값을 먼저 비교합니다.

※ $(요소)[0].offsetTop (해당 애니메이션효과를 줄 요소 위치) 값이랑 비교하는게 좋겠죠?


두번째.

제이쿼리의 .animate() 함수를 이용하거나

css3 의 animation 속성이나 transition 속성을 활용하여 구현이 가능합니다.



부트스트랩에서는 보통 두번째 항목을 클래스로 처리를 해줍니다.


로그인 후 평가할 수 있습니다

답변에 대한 댓글 3개

돼지코구뇽
8년 전
스고이네..!
쥬노
8년 전
ㅎㅎ...좀더 분발해서 해보겠습니다. 감사합니다.
쥬노
8년 전
님아 해결했습니다....^^
축하해주세요....

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인