$(document).ready(function() {
$("#ifrmPopup").hide();
$(".voteList li img").click(function() {
var top = ( $(window).scrollTop() + ($(window).height() - $('#ifrmPopup').height()) / 2 )
var left = ( $(window).scrollLeft() + ($(window).width() - $('#ifrmPopup').width()) / 2 )
$("#ifrmPopup").css('top', top);
$("#ifrmPopup").css('left', left);
$("#ifrmPopup").show();
});
});
[설명]
jQuery의 .scrollLeft() 함수는 좌우로 스크롤된 화면이 왼쪽부터 몇 px인지 구하는 함수. 보통은 0
jQuery의 .scrollTop() 함수는 스크롤된 화면이 맨 위에서부터 몇 px인지 구하는 함수.
jQuery의 .width() 함수는 너비를 구하는 함수인데, $(window).width() 를 하면 현재 화면의 너비를 구한다. 윈도우를 전체화면으로 하지 말고 사이즈를 줄여 놓고 값을 구해 보면 전체 가로 사이즈보다 작게 나오는 것을 알 수 있다.
jQuery의 .height() 함수 역시 마찬가지인데, $(window).height() 라고 하면 윈도우에서 메뉴바 같은 것들을 빼고 실제 사용되는 부분의 높이만 구해 준다.
$("#ifrmPopup").hide();
$(".voteList li img").click(function() {
var top = ( $(window).scrollTop() + ($(window).height() - $('#ifrmPopup').height()) / 2 )
var left = ( $(window).scrollLeft() + ($(window).width() - $('#ifrmPopup').width()) / 2 )
$("#ifrmPopup").css('top', top);
$("#ifrmPopup").css('left', left);
$("#ifrmPopup").show();
});
});
[설명]
jQuery의 .scrollLeft() 함수는 좌우로 스크롤된 화면이 왼쪽부터 몇 px인지 구하는 함수. 보통은 0
jQuery의 .scrollTop() 함수는 스크롤된 화면이 맨 위에서부터 몇 px인지 구하는 함수.
jQuery의 .width() 함수는 너비를 구하는 함수인데, $(window).width() 를 하면 현재 화면의 너비를 구한다. 윈도우를 전체화면으로 하지 말고 사이즈를 줄여 놓고 값을 구해 보면 전체 가로 사이즈보다 작게 나오는 것을 알 수 있다.
jQuery의 .height() 함수 역시 마찬가지인데, $(window).height() 라고 하면 윈도우에서 메뉴바 같은 것들을 빼고 실제 사용되는 부분의 높이만 구해 준다.
'web standard > jquery' 카테고리의 다른 글
| 탭메뉴+prev, next (0) | 2011.08.08 |
|---|---|
| 특정영역 인쇄 (0) | 2011.07.18 |
| 탭메뉴 (1) | 2011.06.16 |
| 이미지롤오버 (0) | 2011.04.06 |
| 가로&세로 슬라이드 (0) | 2011.04.04 |
