Dreamweaver a jQuery Mobile Integration

• Smět 6, 2024

Během několika posledních let Dreamweaver^R získal stále více funkcí pro vytváření mobilního webového obsahu a mobilních aplikací. Tato nová aktualizace CS6 není výjimkou. Dreamweaver CS6 má vylepšený pracovní postup s funkcemi jQuery Mobile.

Zahájení nového mobilního projektu je snadné díky nové možnosti Stránka ze vzorku v dialogovém okně Nový dokument. Ze složky Mobile Starters si můžete vybrat vzorek jQuery Mobile. Tato vzorová stránka obsahuje některé předdefinované grafické soubory, soubory CSS a JavaScript.

Z této ukázkové stránky můžeme začít stavět náš projekt přidáním prvků na stránku.

1. Na panelu Vložit vybereme z nabídky kategorie jQuery Mobile. Zobrazí se předdefinované komponenty.
   
   
2. Chcete-li přidat novou součást, umístíme kurzor na místo, kde bude přidán nový konstrukční prvek, a klikneme na jednu z komponent v seznamu. Pro náš příklad si vybereme jezdec.
   
   Dreamweaver automaticky přidá kód posuvníku na naši stránku. V živém zobrazení vidíme náš nový posuvný ovladač.
   
   

Ale tato stránka je trochu obecná. S novým panelem jQuery Mobile Swatches máme rychlý a snadný způsob úpravy naší stránky.

1. V nabídce Menubar klikněte na Okno - jQuery Mobile Swatches. Pokud jste dosud nenaložili podpůrné grafické soubory, soubory CSS a JavaScript, zobrazí se vyskakovací dialogové okno. Klepnutím na Kopírovat načte soubory.
   
   
2. Nový panel jQuery Mobile Swatches je prázdný, dokud na vzorové stránce nevyberete prvek. Když vyberete prvek, panel zobrazí odpovídající políčka k dispozici pro daný prvek. Pokud vybereme prvek záhlaví, zobrazí se několik motivů záhlaví.
   
   
3. Pokud přepneme na živé zobrazení, můžeme kliknout na každý vzorník motivu a zobrazit náhled, jak budou vypadat.
   
   

Můžeme to zopakovat pro všechny designové prvky na naší stránce. Když to děláme, panel jQuery Mobile Swatches zobrazí odpovídající dostupné vzorky vzorníku. Můžeme také použít přepínač Resolution (Rozlišení) pro náhled návrhu, jak bude vypadat na rozlišení plochy a tabletu.

Pokud použijeme odkaz Získat více témat ve spodní části panelu, otevře se webový prohlížeč pro web ThemeRoller pro jQuery Mobile.

* Adobe mi poskytla kopii tohoto softwaru pro účely kontroly.

Copyright 2018 Adobe Systems Incorporated. Všechna práva vyhrazena. Snímky obrazovky produktů Adobe přetištěné se souhlasem společnosti Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst a Flash Paper je / jsou [a] registrovanou ochrannou známkou (značkami) nebo ochrannou známkou (značkami) společnosti Adobe Systems Incorporated ve Spojených státech a / nebo jiných zemích.

Video Návody: Part 10: Using the jQuery Mobile Theme Roller in DreamWeaver (Smět 2024).