웹 프로그래밍/JQUERY MOBILE

$("#btnText").click(function(){ $("#btnTarget").attr("value", "텍스트 변경"); $("#btnTarget").button("refresh"); }); $("#btnIconPosTop").click(function(){ $("#btnTarget").button("option", "iconpos", "top"); }); $("#btnIconPosBottom").click(function(){ $("#btnTarget").button("option", "iconpos", "bottom"); }); $("#btnIconPosLeft").click(function(){ $("#btnTarget").button("option", "iconpos", "left"); ..

data-role="button" 로 사용한다. data-enhanced="true" (기본값은 "false")를 이용하면 DOM요소와 속성을 이미 처리된 것으로 인식하여 요소와 속성을 생성하지 않는다. data-corners="false" // 코너 직각으로 data-iconpos="top" //아이콘 위치 data-iconpos="bottom" data-iconpos="left" data-iconpos="right" data-icon="home" //아이콘종류 data-theme="a" //테마선택 data-iconshadow="true" //그림자넣기 data-inline="true" //텍스트크기맞춤 disabled // 비활성화 버튼 기본 a 기본 button Enhanced 코너 false 아..

클래스 ui-bar 는 한 섹션의 타이틀을 나타낼때 주로 사용하며 바 형태의 모양을 만들어주다. ui-bar-a, ui-bar-b는 테마를 선택해준다. ui-bar-a : 회색 배경에 검정색 글자 ui-bar-b : 검정색 배경에 흰색 글자 클래스 ui-body 는 한 섹션의 내용을 나타낸다. 클래스 ui-corner-all 은 해당 요소를 둥근 모양으로 나타낸다.

Hello Hello 제이쿼리 모바일 시작하기 제이쿼리 모바일은 기본적으로 태그명과 data-role 을 이용해 대부분 컴포넌트를 구분한다. role 는 시각장애인분들이 사용하는 스크린리더기 또는 음성브라우저 등에서 웹사이트의 접근성을 높이기 위해 사용하는 속성으로 요소의 역할을 이해할 수 있게 설명해주는 속성이다 data-position="fixed" 를 사용하면 화면 data-role="header" 의 경우는 상단에, data-role="footer"의 경우는 하단에 고정시킬 수 있다.

속성 설명 width 폭 height 높이 initial-scale 초기 확대치 maximum-scale 최대 확대치 user-scaleble 사용자 확대 추소 여부 target-densitydpi device-dpi high-dpi - (480*800) medium-dpi - (320*480 선언되지 않았을경우 기본값) low-dpi target-densitydpi 는 안드로이드만 지원한다. 보통은 medium-dpi로 사용하지만 레이아웃 크기가 따로 구동될경우 device-dpi를 사용하면 해결된다. ※ 참고 일반적으로 PSD파일 사이즈는 width를 480으로 작업하면 될것같다.