Selasa, 01 Juli 2014
Change theme jquerymobile
To apply theme you must copy this data-theme="?" in <div data-role="page" >
There is 3 choice theme :
a. This is “a” theme / default theme
<div data-role="page" data-theme="a">
Result :
b. This is “b” theme
Make Navigation Navbar
First, make id into body file html, to add some page.
<body>
<div data-role="page" id="pageone">
<div data-role="header">
<h1>this is header</h1> <div data-role="main" class="ui-content">
<h3>This is Page one</h3>
</div>
<div data-role="footer" data-position="fixed">
<h3>This is footer</h3>
</div>
</div>
<div data-role="page" id="pagetwo">
<div data-role="header">
<h1>this is header</h1> <div data-role="main" class="ui-content">
<h3>This is Page two</h3>
</div>
<div data-role="footer" data-position="fixed">
<h3>This is footer</h3>
</div>
Senin, 30 Juni 2014
Tutorial - How to Make Android Application with Jquerymobile - Step 4 - Transition Effects
Step 4 – Transition Effects
An awesome application must have an unique transition effect, Transition effect can be applied to internal link (different page in the same html file) by using “data-transition” attribute<a href="#anylink" data-transition="slide">Go to Page Two</a>
# There many choice for transition effect
1. Fade
<a href="#anylink" data-transition="fade">Go to Page Two</a>
Tutorial - How to Make Android Application with Jquerymobile - Step 3 - Button and Navbar
Step 3 – Button and Navbar
After you learn Step 2 – Header, main, footer, and pages. Now go to Step 3 –Button and Navbars.1. Creating Button, button can create by 3 ways :
a. Using input element
<input type="button" value="Button">b.Using button element with class="ui-btn"
<button class="ui-btn">Button</button>c. Using <a>
<a href="#" class="ui-btn">Button</a>
Sabtu, 28 Juni 2014
Tutorial - How to Make Android Application with Jquerymobile - Step 2 - Header, main, footer, and pages
Tutorial 2 – Header, main, footer, and pages
After you learn tutorial 1 - basic, now go to Step 2 – Header, main, footer, and pages1. Make div data-role="page" in body
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/jquery.mobile-1.4.2.min.css">
<script src="js/jquery-1.10.2.min.js"></script>
Tutorial - How to Make Android Application with Jquerymobile - Step 1 - Basic
Hi everybody,
It is my first post in this blog, okay in this occasion I will share to you about "HOW TO MAKE ANDROID APPLICATION with JQUERY MOBILE". Before you studying jquerymobile I wish you have basic knowledge of html, css, jquery.
Jquery mobile is a framework for creating mobile web applications. Many developer use jquery mobile to their application like :
1. Facebook app
2. Twitter app
Langganan:
Postingan
(
Atom
)