JQuery mobile - JQM: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
(Die Seite wurde neu angelegt: „ == Snippets == === Hallo Welt === <pre> <!DOCTYPE html> <html> <head> <title>Hallo Welt</title> <link rel="stylesheet" href="http://code.jquery.com/mobile/1…“)
 
Zeile 33: Zeile 33:
  
 
</pre>
 
</pre>
 +
 +
== JQM-Seite ==
 +
In JQM können auch mehrere Seiten in einem HTML Dokument sein. Eine JQM Seite wird so definiert:
 +
<pre>
 +
<div data-role="page">
 +
</div><!-- /page -->
 +
</pre>
 +
 +
== Vordefinierte Bereiche: Header, Footer, Content ==
 +
Innerhalb der Seite kann man Bereiche nutzen:
 +
 +
<pre>
 +
  <div data-role="header">
 +
  </div><!-- /header -->
 +
  <div data-role="content">
 +
  </div><!-- /content -->
 +
  <div data-role="footer">
 +
  </div><!-- /footer -->
 +
</pre

Version vom 16. September 2011, 13:30 Uhr

Snippets

Hallo Welt


<!DOCTYPE html>
<html>
<head>

 <title>Hallo Welt</title>
 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.css" />
 <script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
 <script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"></script>

</head>
<body>

<div data-role="page">
   <div data-role="header">
     <h1>Header Page 1</h1>
   </div><!-- /header -->
   <div data-role="content">
     <p>Hallo Welt !</p>
   </div><!-- /content -->
   <div data-role="footer">
     <h4>Footer Page 1</h4>
   </div><!-- /footer -->
</div><!-- /page -->

</body>
</html>

JQM-Seite

In JQM können auch mehrere Seiten in einem HTML Dokument sein. Eine JQM Seite wird so definiert:

<div data-role="page">
</div><!-- /page -->

Vordefinierte Bereiche: Header, Footer, Content

Innerhalb der Seite kann man Bereiche nutzen:

   
</pre