[해피CGI][cgimall] 스크롤시 이미지를 가로지르는 텍스트 만들기

화면을 스크롤하면 텍스트가 우측으로 이동되며 이미지를 가로지르는 듯한 효과를 보여줍니다.

홈페이지, 첨부파일을 확인하시면 사용된 소스를 확인하실 수 있습니다.



[html]

기본 html 소스에서 배경이미지와, 동일한 텍스트 2개를 만들어 줍니다.



[style]

position, overflow, z-index 스타일을 설정하여
지나가는 텍스트 > 이미지 > 이미지 안 텍스트 가 출력되도록 조정합니다.


[script]

스크롤시 텍스트를 이동해주는 스크립트 소스입니다.
본 소스를 상단이 아닌 html 하단에 추가하셔야 작동됩니다.


소스를 참고하셔서 응용하여 다양하게 적용해보세요 ^^