programing

jQuery를 사용하여 폭과 높이를 동적으로 설정하는 방법

muds 2023. 11. 7. 21:11
반응형

jQuery를 사용하여 폭과 높이를 동적으로 설정하는 방법

폭과 높이를 설정하고 싶습니다.div요소는 동적으로 jQuery를 사용합니다.

대체하려고 했는데요

<div id="mainTable" style="width:100px; height:200px;"></div>

이 경우:

$("#mainTable").css("width", "100");
$("#mainTable").css("height", "200");

하지만 저에게는 통하지 않습니다.

그 이유를 이해할 수 있도록 도와주시기 바랍니다.

여러분 감사합니다.

문제는 숫자의 따옴표에 있었습니다.잘 작동합니다.

$("#mainTable").css("width", 100);
$("#mainTable").css("height", 200);

다음을 수행할 수 있습니다.

$(function() {
  $("#mainTable").width(100).height(200);
});

이것은 2가지 변경사항을 가지고 있습니다. 이제 와 를 사용하고 코드를 실행합니다.document.ready이벤트성의

없는.$(function() { })포장지(또는)$(document).ready(function() { })당신이 원한다면), 당신의 요소는 아직 존재하지 않을 수 있습니다.$("#mainTable")아무것도 찾지 못할 뿐...뭐, 할 일을 하라구요.여기에서 사용 예시를 볼 수 있습니다.

@Misha Moroshko가 이미 글을 올렸듯이, 이것은 효과가 있습니다:

$("#mainTable").css("width", 100);
$("#mainTable").css("height", 200);

@Nick Craver의 답변에 비해 이 기법의 장점이 있습니다. 다양한 단위를 지정할 수도 있습니다.

$("#mainTable").css("width", "100%");

따라서 @Nick Craver의 방법은 실제로 일부 사용자들에게 잘못된 선택일 수 있습니다.jquery API(http://api.jquery.com/width/) :

.css(width)와 .width()의 차이점은 후자가 단위가 없는 픽셀 값(예: 400px)을 반환하는 반면 전자는 단위가 온전한 값(예: 400px)을 반환한다는 것입니다.수학적 계산에서 요소의 너비를 사용해야 할 경우 .width() 방법을 사용하는 것이 좋습니다.

나는 아래 코드로 시도해 보았지만 잘 작동했습니다.

var modWidth = 250;
var modHeight = 150;

아래 예 :-

$( "#ContainerId .sDashboard li" ).width( modWidth ).height(modHeight);

시도해 보기:

<div id="mainTable" style="width:100px; height:200px;"></div> 

$(document).ready(function() {
  $("#mainTable").width(100).height(200);
}) ;

또는 다음 구문을 사용합니다.

$("#mainTable").css("width", "100px");
$("#mainTable").css("height", "200px");

위의 모든 제안들을 시도해 보았는데 그 중 아무 것도 나에게 맞지 않았고, 그들은 클라이언트 Width와 클라이언트를 변경했습니다.높이는 실제 너비와 높이가 아닙니다.

$(.width).width 및 height 메서드에 대한 jQuery 문서에는 다음과 같이 나와 있습니다. ".width("value")는 CSS 상자 크기 지정 속성의 값에 관계없이 상자의 내용 너비를 설정합니다."

CSS 접근 방식도 마찬가지여서 대신 $(.attr() 메서드를 사용해야 했습니다.

_canvas.attr('width', 100);
_canvas.attr('height', 200);

요소의 크기를 조정하려고 했는데 다소 다르거나 그렇지 않기 때문에 이것이 저에게 영향을 미치는지 모르겠습니다.

$("#mainTable").css("width", "200px");
$("#mainTable").css("height", "2000px");

언급URL : https://stackoverflow.com/questions/2722068/how-to-set-width-and-height-dynamically-using-jquery

반응형