Fork me on GitHub

jquery-mobile 2.0.212

node:

XMLNode

THE
content()
FUNCTION
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

content() selects the JQuery Mobile node with the specified data-role of "content".

content() selects the JQuery Mobile node with the specified data-role of "content". The following example opens the jQuery Mobile content scope.

*
This function has no arguments
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.content() {
 log("Inside an element with the data-role of content")
}
»
View Source
node:

XMLNode

THE
footer()
FUNCTION
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

footer() selects the JQuery Mobile node with the specified data-role of "footer".

footer() selects the JQuery Mobile node with the specified data-role of "footer". The following example opens the jQuery Mobile footer scope.

*
This function has no arguments
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.footer() {
 log("Inside an element with the data-role of footer")
}
»
View Source
node:

XMLNode

THE
header()
FUNCTION
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

header() selects the JQuery Mobile node with the specified data-role of "header".

header() selects the JQuery Mobile node with the specified data-role of "header". The following example opens the jQuery Mobile header scope.

*
This function has no arguments
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.header() {
 log("Inside an element with the data-role of header")
}
»
View Source
node:

XMLNode

THE
init()
FUNCTION
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

init() adds the JQuery Mobile framework to your Moovweb project.

init() adds the jQuery Mobile framework to your project and sets up the required scaffold needed for each page. This is the first step in using JQuery Mobile. Only after calling init() will other jQuery Mobile functions take effect. The function takes no arguments. The following example initializes jQuery Mobile in your Moovweb project, but should probably be called earlier in the flow of your transformation rather than later to put the proper structure in place.

*
This function has no arguments
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.init()
»
View Source
node:

XMLNode

THE
jqm(Text %role)
FUNCTION
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

jqm(role) selects the JQuery Mobile node with the specified role.

jqm(role) selects the JQuery Mobile node with the specified role. The function takes one argument, which is the role of the node to be selected. Several helper functions exist which leverage this function to make selecting common JQuery Mobile attributes easy: header(), content(), footer()

The following example selects all the elements with the data-role attribute equal to "button".

*
Argument
Type
Name
Text %role
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.jqm("button") {
  log("Iterating over all the jQuery Mobile buttons")
}
»
View Source
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

move_to(node, role, position) moves a node to the specified JQuery Mobile role at the specified position.

move_to(node, role, position) moves a node to the specified JQuery Mobile role at the specified position. The function takes three arguments: 1) The XMLNode to which is to be moved 2) The role of the JQuery Mobile node to which the node (1) is to be moved into 3) The position string within the JQuery Mobile node at which the node is to be ("top" or "bottom") Several helper functions exist which leverage this function to make moving nodes to JQuery Mobile scaffold nodes easy: move_to_header(), move_to_header(Text %xpath) move_to_content(), move_to_content(Text %xpath) move_to_footer(), move_to_footer(Text %xpath) In most cases, the helper functions will be sufficient to create the JQuery Mobile scaffold.

The example below shows how to use the helper functions to configure JQuery Mobile.

*
Arguments
Type
Name
XMLNode %node
Text %role
Text %position
Explore more ways to use this function in our Tritium Tester
»
Example
$("/html/body") {
  jqm.move_to_header("div[@id='header']") {
    $("./a[@class='mw_logo']") {
      attribute("data-transition", "pop")
    }   
  }
  jqm.move_to_footer("div[@class='footer']")
  jqm.move_to_content("*[not(@data-role)]")
}
»
View Source
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

set_all_transitions(transition_type) sets the transition animation for all anchor nodes when utilizing the JQuery Mobile framework.

set_all_transition(transition_type) sets the transition animation for all anchor nodes when utilizing the JQuery Mobile framework. This function will search the entire document, regardless of the scope in which it is called. The function takes one argument, which is the transition type. Related functions: set_transition(xpath, transition_type)

The following adds the "slide" JQuery Mobile animation to all anchor nodes in the document.

*
Argument
Type
Name
Text %transition_type
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.set_all_transition("slide")
»
View Source
node:

XMLNode

mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

set_back_btn(bool) determines whether the JQuery Mobile back button should be present or not.

set_back_btn(bool) determines whether the JQuery Mobile back button should be present or not. The function takes one argument, which is a boolean string. If "true", JQuery Mobile will automatically add a back button to non-root pages. The following example enables a back button for the current page.

*
Argument
Type
Name
Text %transition_type
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.set_back_btn("true")
»
View Source
node:

XMLNode

mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

set_back_btn_text(text) sets the JQuery Mobile back button text.

set_back_btn_text(text) sets the JQuery Mobile back button text. The function takes one argument, which is the text for the back button. Note that if the back button is not being used (set_back_btn("false")), this function will have no affect. The following example sets the back button text for the current page.

*
Argument
Type
Name
Text %text
Explore more ways to use this function in our Tritium Tester
»
Example
jqm.set_back_btn_text("Back")
»
View Source
mixer
jquery-mobile 2.0.212
category
JQueryMobile
{
Overview

set_transition(xpath, transition_type) sets the transition animation that is triggered by jQuery Mobile.

set_transition(xpath, transition_type) sets the transition animation that is triggered by jQuery Mobile when the element is clicked. It should be called inside any link including those with data-role="button". The function takes two arguments, the first is optional xpath to the node you want to set the transition on. The second argument is the transition type. Related functions: set_all_transitions(transition_type)

The following adds the "pop" JQuery Mobile animation to the anchor with the id "logo".

*
Arguments
Type
Name
Text %xpath
Text %transition_type
Explore more ways to use this function in our Tritium Tester
»
Example
$("//a[@id='logo']") {
  jqm.set_transition("pop")
}
set_transition("//a[@id='logo']", "pop")
»
View Source