모바일 프레임워크 버튼 아이콘 변경
- 작성자 :
- 이*조
- 작성일 :
- 2011-11-15 19:54:21
- 조회수 :
- 1,859
- 구분 :
- 모바일
- 진행상태 :
- 완료
Q
안녕하세요
Mobile E-govframework를 사용하여 프로그램을 개발하고 있습니다.
<a id="toggleSearchPan" class="toggleSearchPan" data-icon="arrow-d" data-theme="a" data-role="button" data-iconshadow="false" ></a>
위와 같은 코드를 사용하여 버튼을 생성하였고 .
$("#toggleSearchPan").buttonMarkup({ icon: "arrow-u" });
위의 코드를 사용하여 버튼의 아이콘을 변경하고자 하였으나, 버튼이 중첩되어 생성된것 처럼 변경이 되고 생성이 되지 않는 듯 합니다.
버튼의 아이콘을 변경하는 방법에 대하여 질문 드립니다.
============ 아래는 JQueryMobile 을 사용하지 않고 Element를 분석하여 아이콘을 변경하도록 작성한 현재의 코드 입니다.
$('span [class="ui-icon ui-icon-arrow-u"]').attr("class", "ui-icon ui-icon-arrow-d");
// button은 a 태그에 span 태그가 중첩되어 생성되고 data-icon 의 값 앞에 ui-icon- 을 붙여서 class를 정의 하기때문에 ui-icon-arrow-u인 것을 찾아서 ui-icon-arrow-d 로 변경을 하면 arrow-u 에서 arrow-d의 아이콘으로 변경이 가능함.
Mobile E-govframework를 사용하여 프로그램을 개발하고 있습니다.
<a id="toggleSearchPan" class="toggleSearchPan" data-icon="arrow-d" data-theme="a" data-role="button" data-iconshadow="false" ></a>
위와 같은 코드를 사용하여 버튼을 생성하였고 .
$("#toggleSearchPan").buttonMarkup({ icon: "arrow-u" });
위의 코드를 사용하여 버튼의 아이콘을 변경하고자 하였으나, 버튼이 중첩되어 생성된것 처럼 변경이 되고 생성이 되지 않는 듯 합니다.
버튼의 아이콘을 변경하는 방법에 대하여 질문 드립니다.
============ 아래는 JQueryMobile 을 사용하지 않고 Element를 분석하여 아이콘을 변경하도록 작성한 현재의 코드 입니다.
$('span [class="ui-icon ui-icon-arrow-u"]').attr("class", "ui-icon ui-icon-arrow-d");
// button은 a 태그에 span 태그가 중첩되어 생성되고 data-icon 의 값 앞에 ui-icon- 을 붙여서 class를 정의 하기때문에 ui-icon-arrow-u인 것을 찾아서 ui-icon-arrow-d 로 변경을 하면 arrow-u 에서 arrow-d의 아이콘으로 변경이 가능함.
A
안녕하세요
모바일 전자정부 사업단 입니다.
기재해주신 소스로 버튼의 아이콘을 변경시에는 버튼이 중쳡되어 생기는데요 이는 buttonMarkup 테그와 data-role="button"의 선언을 동시에 하셨기 때문입니다.
일단
<a id="toggleSearchPan" class="toggleSearchPan" data-icon="arrow-d" data-theme="a" data-iconshadow="false">button</a> 처럼 data-role="button"을 삭제하시고
상위 스크립트에
$("#toggleSearchPan").buttonMarkup({ icon: "arrow-u" });
를 선언하시면 중첩되지 않으며 arrow-u의 아이콘을 가진 버튼이 출력됩니다.
감사합니다.
모바일 전자정부 사업단 입니다.
기재해주신 소스로 버튼의 아이콘을 변경시에는 버튼이 중쳡되어 생기는데요 이는 buttonMarkup 테그와 data-role="button"의 선언을 동시에 하셨기 때문입니다.
일단
<a id="toggleSearchPan" class="toggleSearchPan" data-icon="arrow-d" data-theme="a" data-iconshadow="false">button</a> 처럼 data-role="button"을 삭제하시고
상위 스크립트에
$("#toggleSearchPan").buttonMarkup({ icon: "arrow-u" });
를 선언하시면 중첩되지 않으며 arrow-u의 아이콘을 가진 버튼이 출력됩니다.
감사합니다.
