프로그래밍 언어/jQuery, ajax

jQuery를 사용하여 DIV를 화면 중앙에 배치하는 방법

Rateye 2021. 9. 29. 10:26
728x90
반응형
질문 : jQuery를 사용하여 DIV를 화면 중앙에 배치

jQuery를 사용하여 화면 중앙에 <div> 를 설정하려면 어떻게해야합니까?

답변

이 함수가 도움이되도록 jQuery에 함수를 추가하는 것을 좋아합니다.

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight()) / 2) + 
                                                $(window).scrollTop()) + "px");
    this.css("left", Math.max(0, (($(window).width() - $(this).outerWidth()) / 2) + 
                                                $(window).scrollLeft()) + "px");
    return this;
}

이제 다음과 같이 작성할 수 있습니다.

$(element).center();

데모 : Fiddle (매개 변수 추가)

출처 : https://stackoverflow.com/questions/210717/using-jquery-to-center-a-div-on-the-screen
728x90
반응형