Notice
Recent Posts
Recent Comments
Link
«   2024/04   »
일 월 화 수 목 금 토
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30
Tags more
Archives
Today
Total
관리 메뉴

moozi

jquery로 div 화면 중앙에 위치하기 본문

TIS_2016/HTML5_1기

jquery로 div 화면 중앙에 위치하기

moozi 2016. 4. 18. 16:50

<!doctype html>

<html>

    <head>

        <meta charset="utf-8">

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

        <script type="text/javascript">

         $( document ).ready(function() {

            $(window).resize();

         }); 

         $(window).resize(function(){

             $('#chapter_select').css({position:'absolute'}).css({

                 left: ($(window).width() - $('#chapter_select').outerWidth())/2,

                 top: ($(window).height() - $('#chapter_select').outerHeight())/2

             });

         });

        </script>

    </head>

    <body>

        <div id="chapter_select">테스트</div>

        

    </body>

</html>



'TIS_2016 > HTML5_1기' 카테고리의 다른 글

node.js mysql연동 샘플  (0) 2016.04.20
캐러셀 자동 슬라이드  (0) 2016.04.19
부트스트랩 캐러셀 3개 붙이기  (0) 2016.04.18
4/18 node.js ejs 테스트  (0) 2016.04.18
두개의 이미지 반응형으로  (0) 2016.04.15
'TIS_2016/HTML5_1기' Related Articles more
Comments