-
jQuery - .resize()jQuery 2020. 6. 23. 18:16
.resize()
- 는 윈도우 크기가 바뀔 때 어떤 작업을 할 수 있게 합니다.
문법
$( window ).resize( function() { // do somthing } );
예제
- 웹 브라우저의 크기를 변경할 때, p 요소의 가로폭을 출력한다.
윈도우 크기를 변경하면 숫자가 바뀐다.
<!doctype html> <html lang="ko"> <head> <meta charset="utf-8"> <title>jQuery</title> <style> p { width: 80%; margin: auto; padding: 20px; text-align: center; border: 1px solid #bcbcbc; } </style> <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> <script> $( document ).ready( function() { var jbWidth = $( 'p' ).width(); $( 'p' ).append( jbWidth ); $( window ).resize( function() { jbWidth = $( 'p' ).width(); $( 'p' ).empty().append( jbWidth ); } ); } ); </script> </head> <body> <p></p> </body> </html>
'jQuery' 카테고리의 다른 글
jQuery - .slice(); (0) 2020.06.23 jQuery - .scrollTop() (0) 2020.06.23 jQuery - replaceWith() (0) 2020.06.23 jQuery - .prop() (0) 2020.06.23 jQuery - .parent() (0) 2020.06.23