A Jquery Mobile érintőképernyőre optimalizált webes keretrendszer (mobile keretrendszerként is ismeretes), még pontosabban Javascript könyvtár. A jquery csapata fejleszti jelenleg. A fejlesztés célja egy olyan keretrendszer ami széleskörüen kompatibilis a különböző okostelefonok tablettek körében, leginkább a gyorsan fejlődő eszközök tették szükségessé. A Jquery Mobile kompatibilis más mobil alkalmazás keretrendszereivel és platformaival. Mint pl. PhoneGap és Worklight. jQuery Mobile framework takes the "write less, do more„ mantra to the next level. Jquery Team
SAJÁTOSSÁGOK
Kompatibilis minden jelentősebb böngészővel, valamint az összes jelentősebb mobil platformmal, mint az Android, IOS, Windows Phone, Blackberry, Webos, Symbian Egyszerű megtanulni mert a jquery-re épül, ezért a szintaxis már sokak számára ismeretes Témázási keretrendszer, ami lehetővé teszi a témák létrehozását Kevés függőséggel rendelkezik és pehelysúlyú a sebesség érdekében Ugyanaz a kódalap bármilyen képernyőre átméreteződik HTML5 alapú konfiguráció az oldalak elrendezése, minimális scripteléssel AJAX alapú navigáció, animált oldalátmenetek, amik lehetővé teszik a szemantikus URL- ok létrehozását push Staten keresztül Érintésre optimalizált interfészek
és
platform
független
felhasználói
ALKALMAZÁSA Két féleképp lehet weboldalunkhoz:
a
Jquery Mobile könyvtárat
hozzáadni
a
link a Jquery Mobile hivatalos oldalán levő könyvtárra link a számítógépen tárolt könyvtárra A hivatalos oldalra mutató link a jobbik megoldás mert, ha frissítés történik a könyvtárban akkor nem kell újra letölteni a fájlt. Csatolni kell a viewport jelölőelemet a megfelelő renderelés és éríntés zoom végett. <meta name="viewport" content="width=device-width, initial-scale=1">
A Jquery Mobile használatához szükség van a Jquery könyvtárára is, máskülönben nem müködik. példa: <meta name="viewport" content="width=device-width, initialscale=1"> <script src="http://code.jquery.com/jquery1.11.3.min.js"> <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile -1.4.5.min.js">
Jellegzetessége
The data – role: "page" a lap ami megjelenik a böngészőben "header" létrehoz egy eszköztárat a lap tetején (gyakran
használják címnek vagy kereső gombnak) "main" definiálja az oldal tartalmát, mint gombok, formok, stb. "footer" létrehoz egy eszköztárat a lap alján
The data – theme: "a"
"b"
szöveg,
képek,
The data – position (hol lesz majd renderelve): "fixed" "top" "bottom" The data – transition:
"fade" az alapértelmezett, kifakul a következő oldalra "flip" átdobódik a másik oldalra "flow" az aktuális oldal kimegy és a következő oldal bejön "pop" mint felugró ablak megy a következő lapra
The data – icon : meghatároz egy ikont a többi beépített közül
Theme Roller Több féle stílus összehasonlítását, színek kombinációját a különböző elemeken (gombok, szövegek, beviteli mezők, stb) teszi lehetőve. Mindent betudunk állítani mi magunk kódolás nélkül. A műveelt végén letölthető a számunkra megfelelő téma stíluslapja. http://themeroller.jquerymobile.com/
Hátrányok A legelső kérdés amit fel kell tenünk magunknak, hogy miért használjam a jquery-t, mert veszélyeket takat: A Jquerynek nagy közössége van, de kicsi a tanulási görbéje. És ebből fakadóan sok az olyan nyíltforráskódú gyöngén megírt lassú alkalmazás. Csökken a kód minősége. Könnyű össze-vissza hatékonyságból
írkálni
a
kódot,
ezzel
veszitve
a
A Jquey nagyon nagy könyvtár a legtöbb esetben apró részleteket használunk mégis az egész könyvtárat inkludolni kell, sok biteot lehet megtakarítani, ha széleskörűen használjuk Megoldás: Először legyünk tisztában az alapokkal és így elkerülhetjük azt a híbát amit sok kezdő programozó nem tesz meg. Lehet, hogy könnyebb a jquery-ben kódolni, de nem minden esetben kifizetődő.
FELHASZNÁLT IRODALOM W1. www.jquerymobile.com W2. www.w3schools.com/jquerymobile W3. www.en.wikipedia.org/wiki/JQuery_Mobile
