.width()メソッドと.Height()メソッド
.width()メソッドと.height()メソッドは、選択した要素の幅または高さを返したり設定したりします.
.width() 메소드와 .height() 메소드로 박스크기 키우고 줄이기 예제
<body>
<h1>.width() 메소드와 .height() 메소드</h1>
<button id="size">크기</button>
<button id="size-up">줄이기</button>
<button id="size-down">키우기</button><br><br>
<div id="box" style="width: 400px; height: 200px; background-color: yellow"></div>
<p id="text"></p>
<script>
$(function() {
$("#size").on("click", function() {
var size = "너비는 " + $("#box").width() + "px이고, 높이는 "
+ $("#box").height() + "px입니다.<br>";
$("#text").html(size);
});
$("#size-up").on("click", function() {
w = $("#box").width();
h = $("#box").height();
$("#box").width(w/2).height(h/2);
var size = "너비는 " + $("#box").width() + "px이고, 높이는 "
+ $("#box").height() + "px로 변경되었습니다.<br>";
$("#text").html(size);
});
$("#size-down").on("click", function() {
w = $("#box").width();
h = $("#box").height();
$("#box").width(w*2).height(h*2);
var size = "너비는 " + $("#box").width() + "px이고, 높이는 "
+ $("#box").height() + "px로 변경되었습니다.<br>";
$("#text").html(size);
});
});
</script>
</body>Reference
この問題について(.width()メソッドと.Height()メソッド), 我々は、より多くの情報をここで見つけました https://velog.io/@timo/jquery-j7kqkzc2テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol