Lees hoe u app-achtige functionaliteit aan uw Dreamweaver-webprojecten toevoegt met behulp van de jQuery-gebruikersinterface en mobiele widgets. U kunt accordeons, tabs, schuifregelaars en vakken voor automatisch aanvullen invoegen zonder dat u code hoeft te schrijven.
Widgets zijn kleine webtoepassingen die zijn geschreven in talen als DHTML en JavaScript en die kunnen worden ingevoegd en uitgevoerd in een webpagina. Webwidgets bieden onder andere een mogelijkheid om het gebruik van een desktop-applicatie na te bootsen op een webpagina.
Widgets van de jQuery-gebruikersinterface zoals accordeon, tabbladen, datumkiezer, schuifregelaar en automatisch aanvullen bieden de ervaring van een desktop-applicatie op het web.
Zo kunt u de widget Balk met tabs gebruiken om de tabbladfunctie van dialoogvensters in desktop-applicaties na te bootsen.
Dreamweaver bevat ook een verzameling jQuery Mobile-widgets die u kunt gebruiken om formulierelementen en andere functies te maken die vaak in mobiele web-apps worden gebruikt. U kunt bijvoorbeeld de jQuery Mobile-widget gebruiken om mobielvriendelijke formulierelementen, zoals tekstgebieden en selectievakjes toe te voegen.
Scripttag met de jQuery API voor de widget. Aanvullende widgets worden aan dezelfde scripttag toegevoegd.
Voor jQuery-effecten wordt de externe verwijzing naar jquery-1.8.24.min.js niet toegevoegd omdat dit bestand automatisch wordt opgenomen als u een effect toevoegt.
Als u het deelvenster Invoegen gebruikt, worden de widgets weergegeven in de sectie jQuery-gebruikersinterface van het deelvenster Invoegen.
Als u jQuery-widget selecteert, worden de eigenschappen weergegeven in het deelvenster Eigenschappen.
Als u bijvoorbeeld een extra tab wilt toevoegen aan de widget Balk met tabs, selecteert u de widget en klikt u op '+' in het deelvenster Eigenschappen.
Voordat u een van de jQuery Mobile-widgets kunt gebruiken, moet u een jQuery Mobile-pagina definiëren door Invoegen > jQuery Mobile > Pagina te selecteren.
Wijzig de standaardinstellingen in het dialoogvenster jQuery Mobile-bestanden of gebruik de ingestelde standaardpaden en klik op OK.
Voer in het dialoogvenster Pagina dat wordt geopend, een naam in het veld ID in en selecteer de selectievakjes naast Koptekst en Voettekst als u een kop- en voettekstsectie op uw mobiele pagina wilt opnemen of schakel ze uit als u geen kop- en voettekstsectie wilt opnemen.
Vervang op de pagina die in Dreamweaver wordt geopend de koptekst, de inhoud en de voettekst door de tekst, de afbeeldingen en de andere elementen die u op uw mobiele pagina wilt opnemen.