본문 바로가기

scrollTop()

(3)
화면이 일정 거리 위 아래로 스크롤 될 때 오른쪽 아래에 '맨위로 가기' 버튼 달기 http://gogoke1.blog.me/20202666575 원리는 이래요.. CSS 스타일 중 position 항목에서 fixed 라는 값이 있는데,이걸 사용하면 화면이 스크롤 되어도 일정 위치에 표시가 됩니다. 말 그대로 position 을 fixed 하는 거에요.. 대체로는 left:10px 와 top:10px 과 같이 왼쪽 위를 기준으로 세팅을 하는데,오른쪽 위에 하려면 right:10px 과 top:10px 처럼 수치를 조정하면 됩니다.왼쪽 아래는 left:10px 과 bottom:10px, 오른쪽 아래는 right:10px 과 bottom:10px 이렇게 하면 되겠네요.이걸 자바스크립트로 화면 사이즈를 재고, 화면 스크롤 할 때마다 어떻게 하고 이렇게 고민할 필요가 없습니다. 그런데, 화면이..
jquery 위치 정보 http://blog.naver.com/uri9148?Redirect=Log&logNo=130091239052$('...').position().left 와 $('...').position().top 은 body 의 left 와 top 이 각각 0 인 곳에서부터 해당 오브젝트 까지의 거리로 계산됨.화면을 스크롤 하더라도 $(window).scrollLeft() 나 $(window).scrollTop() 을 더할 필요가 없다는 이야기.다만, 화면 중앙에 보여줘야 한다면.. $(window).width(), $(window).height(), $('...').width(), $('...').height() 등을 고려.
scroll, 화면에서 특정 영역이 완전히 노출되었는지 체크 특정 위치가 화면에 완전히 노출되었는지.. 요즘 SNS 와 FB 의 열풍으로 이런 이벤트를 적용하는 사이트들이 많아지네요..아래 링크는 inspiredjw.tistory.com 에서 가져왔습니다. 그런데, 숫자 방식이 아니라서 URL 이 너무 길어지네요. 그래서 ShortenURL 처리.http://vo.to/eev Ojbect 를 변수에 담는 것이 습관이 되어서 $(window) 와 $(document) 도 변수에 담아 보았습니다.마이너스 연산이 플러스 연산 보다 속도가 빠르다고 하는데, 루프에 사용되는 것도 아니고..속도 보다는 보는 이에게 보다 안정감을 주는 방식으로 표시했습니다. 이해하기 쉬운 코드가 나중에 유지보수도 편하지요.$(window).scroll(function(){ var $o1 = ..