2011-03-04 5 views
4

기본적으로 jQuery Mobile은 화면의 전체 너비를 채 웁니다. 채울 요소를 제공하는 등 jQuery Mobile에서 채워야하는 크기를 지정하는 방법이 있습니까?jQuery Mobile의 크기 설정?

답변

0

당신은 단순히 예를 들어

... CSS를 통해이를 지정할 수 있습니다

CSS

#wrapper {width:95%} 

또한 이것을 동적으로 할 수

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Page Title</title> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" /> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script> 
</head> 
<body> 

<div id="wrapper"> 
<div data-role="page"> 

    <div data-role="header"> 
     <h1>Page Title</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <p>Page content goes here.</p>  
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 
</div> 

</body> 
</html> 

HTML :

$("div[data-role='page']").css('width',$("#container_element").innerWidth()+"px"); 
+1

'data-role = "page"'div는'position : absolute'을 가지고 있기 때문에'# wrapper'에서 너비를 지정하면 작동하지 않습니다. 제공 한 jQuery 스 니펫은 너비를 변경하지만 컨테이너가있는 위치에 상관없이 페이지의 왼쪽 상단에 남습니다. – mindeavor

+1

jQuery Mobile이 제공 한 프레임 워크를 사용하고있는 것은 말할 필요도 없습니다. 이미 존재하는 래퍼 또는 클래스를 사용할 수있을 때 추가 래퍼 또는 클래스를 추가 할 필요가 없습니다. – commadelimited

0

크기는 자동입니다. div을 페이지 div 외부에 만들고 부동 소수점 및 너비를 픽셀 단위로 설정하면 페이지 div 옆에 올바르게 표시되어야합니다.

3

CSS 파일에이 줄을 설정하기 만하면됩니다. 정말 쉽습니다. 원하는 경우 최대 너비를 너비로 변경하십시오.

.ui-page { 최대 너비 : 500px; }