Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen

Dreamweaver CS3 is uitgerust met functies die het label van Spry, die een WYSIWYG manier AJAX aan een webpagina toevoegen. Ze bieden u automatisch met HTML, CSS en JavaScripts bepaalde interactieve functies uitvoeren. In dit artikel leert u hoe u Spry-panelen met tabs.

Instructies

1Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen


Tabbed panelen bieden een manier om het gebruik van een klein stukje van webpagina onroerend goed bevatten verschillende "panelen" van informatie die de gebruiker tussen. U kunt afbeeldingen, tekst en andere inhoud op de panelen plaatsen. Dit beeld toont een paneel standaard tabbladen met bepaalde inhoud, vóór aanpassing.

2Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen


Plaats de cursor op uw document op de positie waar u wilt invoegen de panelen met tabs. Klik op de tabbladen van het Configuratiescherm in de categorie Spry op de invoegbalk.

3Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen


Het Spry-object wordt geopend op de pagina. Wanneer de Spry-object wordt weergegeven, zijn er twee tabbladen en een gebied waarin u toevoegen of plakken van de inhoud ter vervanging van de tijdelijke aanduiding voor inhoud. De tabbladen heten gewoon tabblad 1 en 2 van het tabblad. (Dit beeld toont 3 tabbladen.)

4

Wanneer de blauwe omtrek markeren de Spry-object in het documentvenster aanwezig is, kunt u de Property inspector om de widget aanpassen. Hier u invoegen of verwijderen van deelvensters met tabblad en de volgorde van de tabbladen wijzigen.

5Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen


De labels op de tabbladen wijzigen door ze te markeren in het documentvenster. Ziet u het oog die aangeeft welk tabblad zichtbaar is, plus kun je de formulering op het etiket van tabblad te wijzigen.

6Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen


Gebruik CSS om het uiterlijk van de widget aanpassen. Wanneer u Spry-Tabbed hettoezichtpanel hebt ingevoegd, wordt het automatisch in Dreamweaver gegenereerd een stylesheet en enkele JavaScripts en ze ingevoegd in uw site. Vind de Spry-panelen met tabs-stijlen in het paneel CSS-stijlen. U kunt deze stijlen om te kleuren, breedtes en andere kenmerken van de verschijning van de panelen met tabs wijzigen bewerken.

7Het gebruik van Dreamweaver CS3 Spry-Tabbed panelen


Als u problemen ondervindt die uitzoeken wat al deze stijlen doen, dubbelklik op de naam van het opmaakmodel (SpryTabbedPanels.css) en open de pagina CSS. U zult zien dat het rijkelijk is toegelicht zodat u kunt begrijpen wat elke stijlregel voor is en om te zien wat kan worden gewijzigd.

8

Wanneer u klaar bent met het invoegen van de inhoud voor elk paneel en wijzigingen hebt aangebracht naar het trapsgewijze Opmaakmodel, ben je klaar voor het uploaden van de nieuwe pagina. Zorg ervoor dat het uploaden van de HTML, CSS en JavaScript bestanden die gerelateerd zijn aan het maken van de functie van Spry-object correct.

Tips & waarschuwingen

  • Nadat u hebt nam deel aan de aanpassing van het object panelen met tabs, ga door de stylesheet en de opmerkingen verwijderen voordat u de CSS-regels naar de server uploaden. Dit bespaart bandbreedte.