반응형
블로그 이미지
개발자로서 현장에서 일하면서 새로 접하는 기술들이나 알게된 정보 등을 정리하기 위한 블로그입니다. 운 좋게 미국에서 큰 회사들의 프로젝트에서 컬설턴트로 일하고 있어서 새로운 기술들을 접할 기회가 많이 있습니다. 미국의 IT 프로젝트에서 사용되는 툴들에 대해 많은 분들과 정보를 공유하고 싶습니다.
솔웅

최근에 올라온 글

최근에 달린 댓글

최근에 받은 트랙백

글 보관함

카테고리

Configuration Options

2012. 9. 29. 05:43 | Posted by 솔웅


반응형

Configuration Options



mobileinit event는 jQuery Mobile configuration options를 바꿀 수 있는 마지막 instant 입니다. 대부분의 옵션들에 대해 이 때 수정할 수 있습니다. 일부 이벤트들은 이 mobileinit event가 지나도 바꿀 수 있는 것들이 있습니다면 어쨌든 그 값들을 바꾸기 위해서는 항상 mobileinit event를 사용합니다. 만약 이 기간동안에 어떤 option의 값이 바뀌지 않으면 jQuery Mobile은 디폴트 값을 할당 합니다.


대부분의 이 option들은 jQuery Mobile에 의해 attribute들로 정의 됩니다.  예를 들어 data-icon, data-transition, data-back-btn-text, etc.. 같은 것 들이죠. HTML 코드에 이 attribute 값들이 정의되어 있지 않다면 디폴트 값이 할당 됩니다. 이 디폴트 값들이 mobileinit event이 진행되는 동안에 수정되어 질 수 있는 값들입니다.


General options


이 option들은 $.mobile object의 프로퍼티들입니다. 예를 들어 ns option은 $.mobile.ns 로 연결 되는 식이죠.


General options


Option

Signification

ns

Defines the namespace (see next section). Default "" (no namespace).

activePageClass

CSS class added to the <div> defining the window when it becomes active. Default "ui-page-active".

ajaxEnabled

Boolean indicating whether the HTML pages are retrieved by Ajax (if true) or not (if false). Default true. If the pages are not retrieved by Ajax, the previous windows are removed from the DOM.

defaultPageTransition

Default transition between two windows. Default "slide".

defaultDialogTransition

Default transition between two windows, one of which is superimposed. Default "pop".

loadingMessage

Message displayed to indicate that a HTML page is being loaded. Default "loading". This option can be changed outside the mobileinit event processing.

pageLoadErrorMessage

Message displayed to indicate an HTML page could not be loaded successfully. Default "Error Loading Page".

autoInitializePage

Boolean indicating if we let jQuery Mobile make himself the first window display. If true (default) the $.mobile.initializePage () is automatically called by jQuery Mobile allowing to display the first window. If false, it will be in our program to do this first viewing (calling ourselves the $.mobile.initializePage ()).


Options managing windows


이 옵션들은  $.mobile.page.prototype.options의 프로퍼티 들입니다. 예를 들어 backBtnText option은  $.mobile.page.prototype.options.backBtnText로 연결 되는 식이죠


Options managing windows


Option

Signification

backBtnText

Sets the text displayed on the Back button. Default "Back".

addBackBtn

Boolean indicating whether the Back button will be displayed in the window. Default false (not displayed).

backBtnTheme

Theme ("a", ..., "e") associated with the Back button. Default null, indicating to use the theme of the enclosing element.

keepNative

Selector specifying the HTML elements that should not be changed by jQuery Mobile into another HTML code. By default those whose data-role attribute is "none" or "nojs".

domCache

Boolean indicating whether the window should be stored in the DOM tree after it is no longer visible. This option only manages the windows that are not already present in the HTML page, ie those recovered by jQuery Mobile via Ajax. Default false (the windows loaded later are removed from the DOM when they become hidden).

theme

Theme ("a", ..., "e") associated with the window. Default "c".

headerTheme

Theme ("a", ..., "e") associated with the title bar. Default "a".

footerTheme

Theme ("a", ..., "e") associated with the bar at the bottom of page. Default "a".

contentTheme

Theme ("a", ..., "e") associated with the contents of the window. Default "".


Options managing lists


이 옵션들은 $.mobile.listview.prototype.options의 프로퍼티들입니다. theme option 같은 경우엔 $.mobile.listview.prototype.options.theme 이런 식으로 사용하시면 됩니다.


Options managing lists


Option

Signification

initSelector

Selector for finding lists in the HTML page. Default "jqmData (role='listview')".

theme

Theme ("a", ..., "e") associated with list items. Default "c".

countTheme

Theme ("a", ..., "e") associated with HTML elements with "ui-li-count" CSS class. Default "c".

dividerTheme

Theme ("a", ..., "e") associated to list items with the data-role="list-divider" attribute. Default "b".

filterTheme

Theme ("a", ..., "e") associated with the search field in the list.

inset

Boolean indicating whether the lists should be displayed with rounded edges. Default false.

filter

Boolean indicating whether to display a search field for list items. Default false.

filterPlaceHolder

String displayed in the search field of a list with the attribute data-filter="true". Default "Filter items ...".


Options managing navigation bars


이 옵션들은 $.mobile.navbar.prototype.options의 프로퍼티 들입니다. iconpos option 같은 경우엔 $.mobile.navbar.prototype.options.iconpos 이런 식으로 사용하시면 됩니다.


Options managing navigation bars


Option

Signification

initSelector

Selector for finding navigation bars in the HTML page. Default "jqmData (role='navbar')".

iconpos

Indicates the position of the icon ("top", "right ","bottom","left") when present in the buttons on the navigation bar. By default "top".

grid

Specifies the maximum number of buttons that may appear in a line of the navigation bar ("a" for 2 buttons max, "b" for 3, "c" for 4 and "d" for 5. By default null, indicating the place buttons at best.


Options managing buttons


이 옵션들은 $.mobile.button.prototype.options의 프로퍼티 들입니다. theme option 같은 경우엔 $.mobile.button.prototype.options.theme이런식으로 사용하

Warning: 이 옵션들은 button() method 를 사용해서 버튼을 생성하면 해당 account 에 적용 됩니다.


Options managing buttons


Option

Signification

initSelector

Selector for finding buttons in the HTML page. Default "button, [type='button'], [type='submit'], [type='reset'], [type='image']".

theme

Theme ("a", ..., "e") associated with buttons. Default null, indicating to use the theme associated with the enclosing element.

icon

Icon associated with buttons. Default null (no icon).

iconpos

Position of the icon in buttons, when present. Default "left".

inline

Boolean indicating whether the width of the button adapts to its contents (if true), or falls of the width of the window (if false). Default false.

corners

Defines if the buttons have rounded edges (if true) or rectangular (if false). Default true (rounded edges).

shadow

Boolean indicating whether a shadow is associated with buttons. Default true (shaded buttons).

iconshadow

Boolean indicating whether a shadow is associated with the icons on the buttons. Default true (has shadow).


Options managing input fields


이 옵션들은 $.mobile.textinput.prototype.options의 프로퍼티 들입니다. theme option의 경우 $.mobile.textinput.prototype.options.theme이렇게 사용하시면 됩니다.


Options managing input fields


Option

Signification

initSelector

Selector for finding input fields in the HTML page. Default "input[type='text'], input[type='search'], :jqmData(type='search'), input[type='number'], :jqmData(type='number'), input[type='password'], input[type='email'], input[type='url'], input[type='tel'], textarea".

theme

Theme ("a", ..., "e") associated with input fields. Default null, indicating to use the theme associated with the enclosing element.


Options managing checkboxes and radio buttons


이 옵션들은 $.mobile.checkboxradio.prototype.options의 프로퍼티 들입니다. theme option의 경우 $.mobile.checkboxradio.prototype.options.theme 이렇게 사용하시면 됩니다.


Options managing checkboxes and radio buttons


Option

Signification

initSelector

Selector for finding checkboxes and radio buttons in the HTML page. Default "input[type='checkbox'], input[type='radio']".

theme

Theme ("a", ..., "e") associated with checkboxes and radio buttons. Default null, indicating to use the theme associated with the enclosing element.



Options managing selection list



이 옵션들은 $.mobile.selectmenu.prototype.options의 프로퍼티 들입니다. theme option의 경우 $.mobile.selectmenu.prototype.options.theme 이렇게 사용하시면 됩니다.


Options managing selection lists


Option

Signification

initSelector

Selector for finding selection lists in the HTML page. Default "select:not(:jqmData( role='slider'))".

theme

Theme ("a", ..., "e") associated with elements of the selection list. Default null, indicating to use the theme associated with the enclosing element.

icon

Icon in the button associated with the selection list. Default "arrow-d" (arrow down).

iconpos

Position of the icon in the button associated with the selection list ("top", "rght", "bottom", "left"). Default "right".

inline

Boolean indicating whether the button for the selection list adjusts in width to its contents (if true) or spreads over the width of the window (if false). Default false.

corners

Defines if the buttons associated with the selection lists have rounded edges (if true) or rectangular (if false). Default true (rounded edges).

shadow

Boolean indicating whether a shadow is associated with the buttons associated with selection lists. Default true (shaded buttons).

overlayTheme

Theme ("a", ..., "e") associated with the border around the elements of the selection list. Default "a".

nativeMenu

Boolean indicating whether the selection list is displayed natively (if true) or so improved by jQuery Mobile (if false). Default true (selection list displayed natively).


Options managing sliders


이 옵션들은 $.mobile.slider.prototype.options의 프로퍼티 들입니다. theme option의 경우 $.mobile.slider.prototype.options.theme 이렇게 사용하시면 됩니다.


Options managing sliders


Option

Signification

initSelector

Selector for finding sliders in the HTML page. Default "input[type='range'], :jqmData(type='range'), :jqmData(role='slider')".

theme

Theme ("a", ..., "e") associated with the cursor moves on the slider. Default null, indicating to use the theme associated with the enclosing element.

trackTheme

Theme ("a", ..., "e") associated with the axis on which the cursor moves. Default null, indicating to use the theme associated with the enclosing element.


Options managing accordion menus


이 옵션들은 $.mobile.collapsible.prototype.options의 프로퍼티 들입니다. theme option 의 경우 $.mobile.collapsible.prototype.options.theme 이렇게 사용하시면 됩니다.


Options managing accordion menus


Option

Signification

initSelector

Selector for finding accordion menus in the HTML page. Default ":jqmData(role='collapsible')".

theme

Theme ("a", ..., "e") associated with the accordion menu. Default null, indicating to use the theme associated with the enclosing element.

iconTheme

Theme ("a", ..., "e") associated with the icons in the accordion menu. Default "d".

collapsed

Boolean indicating whether the menu should be closed or open at startup. Default true (closed menu).


반응형