Handboek Annuleren

Ingebouwd JavaScript-gedrag toepassen

  1. Dreamweaver Handboek
  2. Inleiding
    1. Basisbeginselen van responsief webontwerp
    2. Nieuwe functies in Dreamweaver
    3. Webontwikkeling met Dreamweaver: een overzicht
    4. Dreamweaver / Algemene vragen
    5. Sneltoetsen
    6. Systeemvereisten voor Dreamweaver
    7. Functieoverzicht
  3. Dreamweaver en Creative Cloud
    1. Dreamweaver-instellingen synchroniseren met Creative Cloud
    2. Creative Cloud Libraries in Dreamweaver
    3. Photoshop-bestanden gebruiken in Dreamweaver
    4. Werken met Adobe Animate en Dreamweaver
    5. Voor het web geoptimaliseerde SVG-bestanden uit Libraries extraheren
  4. De werkruimten en weergaven van Dreamweaver
    1. De werkruimte van Dreamweaver
    2. De werkruimte van Dreamweaver optimaliseren voor visuele ontwikkeling
    3. Bestanden zoeken op bestandsnaam of inhoud | Mac OS
  5. Sites opzetten
    1. Over Dreamweaver-sites
    2. Een lokale versie van uw site instellen
    3. Verbinding maken met een publicatieserver
    4. Een testserver instellen
    5. Instellingen van Dreamweaver-sites importeren en exporteren
    6. Bestaande websites overzetten van een externe server naar de hoofdmap van uw lokale site
    7. Toegankelijkheidsfuncties in Dreamweaver
    8. Geavanceerde instellingen
    9. Sitevoorkeuren instellen voor het overzetten van bestanden
    10. Proxyserverinstellingen opgeven in Dreamweaver
    11. Dreamweaver-instellingen synchroniseren met Creative Cloud
    12. Git gebruiken in Dreamweaver
  6. Bestanden beheren
    1. Bestanden maken en openen
    2. Bestanden en mappen beheren
    3. Bestanden van uw server ophalen en op uw server plaatsen
    4. Bestanden inchecken en uitchecken
    5. Bestanden synchroniseren
    6. Bestanden vergelijken om verschillen op te sporen
    7. Bestanden en mappen op uw Dreamweaver-site camoufleren
    8. Ontwerpnotities inschakelen voor Dreamweaver-sites
    9. Potentieel misbruik van Gatekeeper voorkomen
  7. Lay-out en ontwerp
    1. Visuele lay-outhulpmiddelen gebruiken
    2. Uw pagina opmaken met CSS
    3. Responsieve websites ontwerpen met Bootstrap
    4. Mediaquery's maken en gebruiken in Dreamweaver
    5. Inhoud in tabellen presenteren
    6. Kleuren
    7. Responsive design met dynamische rasterlay-outs
    8. Extract in Dreamweaver
  8. CSS
    1. Informatie over CSS (Cascading Style Sheets)
    2. Pagina's opmaken met CSS ontwerpen
    3. CSS-preprocessors gebruiken in Dreamweaver
    4. CSS-stijlvoorkeuren instellen in Dreamweaver
    5. CSS-regels verplaatsen in Dreamweaver
    6. Inline CSS converteren naar een CSS-regel in Dreamweaver
    7. Werken met div-tags
    8. Verlopen toepassen op een achtergrond
    9. CSS3-overgangseffecten maken en bewerken in Dreamweaver
    10. Code opmaken
  9. Pagina-inhoud en assets
    1. Pagina-eigenschappen instellen
    2. Eigenschappen voor CSS-koppen en CSS-koppelingen
    3. Werken met tekst
    4. Tekst, tags en kenmerken zoeken en vervangen
    5. Het deelvenster DOM
    6. Bewerken in Live View
    7. Documenten coderen in Dreamweaver
    8. Elementen selecteren en weergeven in het documentvenster
    9. Teksteigenschappen instellen in de eigenschappencontrole
    10. Spelling op een webpagina controleren
    11. Horizontale lijnen gebruiken in Dreamweaver
    12. Lettertypecombinaties toevoegen en aanpassen in Dreamweaver
    13. Werken met assets
    14. Datums in Dreamweaver invoegen en bijwerken
    15. Favoriete assets maken en beheren in Dreamweaver
    16. Afbeeldingen invoegen en bewerken in Dreamweaver
    17. Mediaobjecten toevoegen
    18. Video's toevoegen in Dreamweaver
    19. HTML5-video invoegen
    20. SWF-bestanden invoegen
    21. Audio-effecten toevoegen
    22. HTML5-audio invoegen in Dreamweaver
    23. Werken met bibliotheekitems
    24. Arabische en Hebreeuwse tekst gebruiken in Dreamweaver
  10. Koppelingen en navigatie
    1. Over koppelingen en navigatie
    2. Koppelingen
    3. Afbeeldingen met hyperlinks
    4. Problemen met koppelingen oplossen
  11. jQuery-widgets en -effecten
    1. De jQuery-gebruikersinterface en mobiele widgets in Dreamweaver gebruiken
    2. jQuery-effecten gebruiken in Dreamweaver
  12. Websites coderen
    1. Over coderen in Dreamweaver
    2. Coderingsomgeving in Dreamweaver
    3. Coderingsvoorkeuren instellen
    4. Codekleuren aanpassen
    5. Code schrijven en bewerken
    6. Coderingstips en codevoltooiing
    7. Code samenvouwen en uitvouwen
    8. Code hergebruiken met codefragmenten
    9. Linting voor code gebruiken
    10. Code optimaliseren
    11. Code bewerken in de ontwerpweergave
    12. Werken met de kopinhoud van pagina's
    13. Include-bestanden op de server invoegen in Dreamweaver
    14. Tagbibliotheken gebruiken in Dreamweaver
    15. Aangepaste tags importeren in Dreamweaver
    16. JavaScript-gedrag gebruiken (algemene instructies)
    17. Ingebouwd JavaScript-gedrag toepassen
    18. Over XML en XSLT
    19. XSL-transformaties op de server uitvoeren in Dreamweaver
    20. XSL-transformaties op de client uitvoeren in Dreamweaver
    21. Tekenentiteiten toevoegen voor XSLT in Dreamweaver
    22. Code opmaken
  13. Productonafhankelijke workflows
    1. Extensies in Dreamweaver installeren en gebruiken
    2. In-app updates in Dreamweaver
    3. Microsoft Office-documenten invoegen in Dreamweaver (alleen Windows)
    4. Werken met Fireworks en Dreamweaver
    5. Inhoud bewerken op Dreamweaver-sites met behulp van Contribute
    6. Integratie van Dreamweaver met Business Catalyst
    7. Persoonlijke e-mailcampagnes maken
  14. Sjablonen
    1. Over Dreamweaver-sjablonen
    2. Sjablonen en op een sjabloon gebaseerde documenten herkennen
    3. Een Dreamweaver-sjabloon maken
    4. Bewerkbare gebieden maken in sjablonen
    5. Herhalingsgebieden en tabellen maken in Dreamweaver
    6. Optionele gebieden in sjablonen gebruiken
    7. Bewerkbare tagkenmerken in Dreamweaver definiëren
    8. Geneste sjablonen maken in Dreamweaver
    9. Sjablonen bewerken, bijwerken en verwijderen
    10. XML-inhoud exporteren en importeren in Dreamweaver
    11. Een sjabloon uit een bestaand document toepassen of verwijderen
    12. Inhoud bewerken in Dreamweaver-sjablonen
    13. Syntaxisregels voor sjabloontags in Dreamweaver
    14. Voorkeuren voor de markering van sjabloongebieden instellen
    15. Voordelen van het gebruik van sjablonen in Dreamweaver
  15. Mobiel en meerdere schermen
    1. Mediaquery's maken
    2. Paginastand voor mobiele apparaten wijzigen
    3. Web-apps voor mobiele apparaten maken met Dreamweaver
  16. Dynamische sites, pagina's en webformulieren
    1. Informatie over web-applicaties
    2. Uw computer instellen voor het ontwikkelen van applicaties
    3. Problemen met databaseverbindingen oplossen
    4. Verbindingsscripts verwijderen in Dreamweaver
    5. Dynamische pagina's ontwerpen
    6. Overzicht van dynamische inhoudsbronnen
    7. Bronnen met dynamische inhoud definiëren
    8. Dynamische inhoud toevoegen aan pagina's
    9. Dynamische inhoud wijzigen in Dreamweaver
    10. Databaserecords weergeven
    11. Livegegevens leveren en problemen oplossen Dreamweaver
    12. Aangepast servergedrag toevoegen in Dreamweaver
    13. Formulieren maken met Dreamweaver
    14. Formulieren gebruiken om informatie van gebruikers te verzamelen
    15. ColdFusion-formulieren maken en inschakelen in Dreamweaver
    16. Webformulieren maken
    17. Verbeterde HTML5-ondersteuning voor formulierelementen
    18. Een formulier ontwikkelen met Dreamweaver
  17. Applicaties visueel samenstellen
    1. Hoofd- en detailpagina's maken in Dreamweaver
    2. Zoekpagina's en resultatenpagina's maken
    3. Een pagina voor het invoegen van records maken
    4. Een pagina voor het bijwerken van records maken in Dreamweaver
    5. Pagina's voor het verwijderen van records maken in Dreamweaver
    6. ASP-opdrachten gebruiken om een database aan te passen in Dreamweaver
    7. Een registratiepagina maken
    8. Een aanmeldingspagina maken
    9. Een pagina maken waartoe alleen geautoriseerde gebruikers toegang hebben
    10. Mappen beveiligen in ColdFusion met Dreamweaver
    11. ColdFusion-componenten gebruiken in Dreamweaver
  18. Websites testen, voorvertonen en publiceren
    1. Pagina's voorvertonen
    2. Dreamweaver-webpagina's voorvertonen op meerdere apparaten
    3. Uw Dreamweaver-site testen
  19. Problemen oplossen
    1. Opgeloste problemen
    2. Bekende problemen

 

 

Gebruik dit onderwerp voor meer informatie over het toepassen van JavaScript-gedrag in Adobe Dreamweaver.

Ingebouwd gedrag gebruiken

Het gedragsvarianten die in Dreamweaver zijn opgenomen, zijn allemaal afgestemd op het gebruik in moderne browsers. In oudere browsers doen ze niets.

Opmerking:

De Dreamweaver-acties zijn zo geschreven dat ze kunnen functioneren in zoveel mogelijk browsers. Als u handmatig code uit een Dreamweaver-actie verwijdert, of deze vervangt door uw eigen code, gaat de compatibiliteit met meerdere browsers mogelijk verloren.

Hoewel de Dreamweaver-acties zijn geschreven om de compatibiliteit tussen browsers te maximaliseren, ondersteunen sommige browsers JavaScript helemaal niet, en zullen veel mensen die internetten JavaScript in hun browsers uitgeschakeld laten. Voor de beste resultaten tussen platforms, zorgt u voor alternatieve interfaces die u tussen <noscript>-tags plaatst zodat mensen zonder JavaScript uw site ook kunnen gebruiken.

De Call JavaScript-gedrag toepassen

Met het gedrag JavaScript aanroepen kunt u zorgen dat er een aangepaste functie of regel JavaScript-code wordt uitgevoerd wanneer zich een gebeurtenis voordoet. (U kunt het script zelf schrijven, maar u kunt ook code gebruiken die worden aangeboden in verscheidene gratis JavaScript-bibliotheken op internet.)

  1. Selecteer een object en kies JavaScript aanroepen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Typ de exacte JavaScript-code die moet worden uitgevoerd of typ de naam van een functie.

    Als u bijvoorbeeld een knop Terug wilt maken, kunt u if (history.length > 0){history.back()} typen. Als u de code in een functie hebt ingekapseld, typt u alleen de functienaam (bijvoorbeeld hGoBack()).

  3. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Eigenschap wijzigen toepassen

Gebruik het gedrag Eigenschap wijzigen om de waarde van een van de eigenschappen van een object (bijvoorbeeld de achtergrondkleur van een laag of de actie van een formulier) te wijzigen.

Opmerking:

Gebruik dit gedrag alleen als u een ervaren programmeur bent en u alles weet van HTML en JavaScript.

  1. Selecteer een object en kies Eigenschap wijzigen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Selecteer in het menu Type element een elementtype om alle geïdentificeerde elementen van dat type weer te geven.
  3. Selecteer een element in het menu Element-id.
  4. Selecteer een eigenschap in het menu Eigenschap of typ de naam van de eigenschap in het vak.
  5. Voer de nieuwe waarde voor de nieuwe eigenschap in het veld Nieuwe waarde in.
  6. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Insteekmodule controleren toepassen

Gebruik het gedrag Insteekmodule controleren om bezoekers naar verschillende webpagina's te sturen afhankelijk van het antwoord op de vraag of ze de gespecificeerde insteekmodule hebben geïnstalleerd. U kunt bezoekers bijvoorbeeld naar de ene pagina sturen als ze Shockwave al hebben en naar de andere pagina als ze Shockwave nog niet hebben geïnstalleerd.

Opmerking:

U kunt met JavaScript geen specifieke insteekmodules detecteren in Internet Explorer. Als u echter Flash of Director selecteert, wordt er VBScript-code aan uw pagina toegevoegd waarmee deze insteekmodules wel worden gedetecteerd in Internet Explorer op Windows-computers. De detectie van insteekmodules in Internet Explorer onder Mac OS is niet mogelijk.

  1. Selecteer een object en kies Insteekmodule controleren in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Selecteer een insteekmodule in het menu Insteekmodule of klik op Invoeren en typ de exacte naam van de insteekmodule in het aangrenzende vak.

    U moet de naam van de insteekmodule exact zo invoeren als is opgegeven in vet op de pagina met informatie over insteekmodules (plug-ins) in Netscape Navigator. (Selecteer in Windows in de Help van Netscape Navigator de optie About Plug‑ins of selecteer in Mac OS de optie About Plug‑ins in het Apple-menu.)

  3. Geef in het vak Indien gevonden, ga naar URL een URL op voor bezoekers die over de insteekmodule beschikken.

    Als u een externe URL opgeeft, moet u het voorvoegsel http:// in het adres opnemen. Als u het veld leeg laat, blijven bezoekers op dezelfde pagina.

  4. Geef in het vak Ga anders naar de URL een alternatieve URL op voor bezoekers die de insteekmodule niet hebben. Als u het veld leeg laat, blijven bezoekers op dezelfde pagina.
  5. Geef op wat er moet gebeuren als detectie van insteekmodules niet mogelijk is. Als detectie niet mogelijk is, wordt de bezoeker standaard naar de URL gestuurd die in het vak Ga anders naar de URL is opgegeven. Als u de bezoeker daarentegen naar de eerste URL (in het tekstvak Indien gevonden, ga naar URL) wilt sturen, selecteert u de optie Ga altijd naar de eerste URL als detectie niet mogelijk is. Als u deze optie selecteert, betekent dat in feite: 'neem aan dat de bezoeker over de insteekmodule beschikt, tenzij de browser expliciet aangeeft dat de insteekmodule niet aanwezig is'. In het algemeen geldt dat u deze optie kunt selecteren als de inhoud van de insteekmodule deel uitmaakt van de webpagina. Als dat niet het geval is, moet u deze optie niet selecteren.
    Opmerking:

    Deze optie is alleen van toepassing op Internet Explorer. Netscape Navigator kan insteekmodules altijd detecteren.

  6. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag AP-element slepen toepassen

Met het gedrag AP-element slepen kan de bezoeker een absoluut gepositioneerd (AP) element slepen. Gebruik dit gedrag om puzzels, schuifregelaars en andere beweegbare interface-elementen te maken.

U kunt onder andere het volgende opgeven: de richting waarin de bezoeker het AP-element kan slepen (horizontaal, verticaal of in elke richting), een bestemming waarnaar de bezoeker het AP-element moet slepen, of de bestemming magnetisch moet zijn en het AP-element moet aantrekken als dat zich binnen een straal van een bepaald aantal pixels ten opzichte van deze bestemming bevindt, wat er moet gebeuren als het AP-element zijn bestemming raakt en meer.

Omdat het gedrag AP-element slepen moet worden aangeroepen voordat de bezoeker het AP-element kan slepen, moet u het gedrag AP-element slepen aan het body-object koppelen (met de gebeurtenis onLoad).

  1. Selecteer Invoegen > Lay-outobjecten > AP Div of klik op de knop AP Div tekenen in het deelvenster Invoegen om een AP Div in de ontwerpweergave van het documentvenster te tekenen.
  2. Klik op de <body>-tag in de tagkiezer in de linkerbenedenhoek van het documentvenster.
  3. Selecteer AP-element slepen in het menu Gedrag toevoegen van het deelvenster Gedrag.

    Als AP-element slepen niet beschikbaar is, hebt u waarschijnlijk een AP-element geselecteerd.

  4. Selecteer AP-element in het pop-upmenu AP-element.
  5. Selecteer Beperkt of Onbeperkt in het pop-upmenu Verplaatsing.

    Onbeperkte verplaatsing is geschikt voor puzzels en andere spelletjes waarbij items moeten worden gesleept en neergezet. Voor schuifregelaars en beweegbare decorstukken, zoals laden van kasten, gordijnen en lamellen kunt u het beste voor beperkte verplaatsing kiezen.

  6. Voor beperkte verplaatsing kunt u waarden (in pixels) invoeren in de vakken Omhoog, Omlaag, Links en Rechts.

    Dit zijn relatieve waarden ten opzichte van de beginpositie van het AP-element. Als u de beweging wilt beperken tot een rechthoekig gebied, voert u in alle vier de tekstvakken positieve waarden in. Als u alleen een verticale beweging wilt toestaan, voert u in de vakken Omhoog en Omlaag positieve waarden in en voert u in de vakken Links en Rechts de waarde 0 in. Als u alleen een horizontale beweging wilt toestaan, voert u in de vakken Links en Rechts positieve waarden in en voert u in de vakken Omhoog en Omlaag de waarde 0 in.

  7. Voer in de vakken Links en Boven de waarden (in pixels) in voor de neerzetbestemming.

    De neerzetbestemming is de plaats waar de bezoeker het AP-element naartoe moet slepen. Een AP-element heeft de neerzetbestemming bereikt wanneer de coördinaten voor de linkerkant en de bovenkant van het element overeenkomen met de waarden die u in de vakken Links en Boven hebt ingevoerd. Dit zijn relatieve waarden ten opzichte van de linkerbovenhoek van het browservenster. Klik op Huidige positie ophalen om in de tekstvakken automatisch de huidige positie van het AP-element in te vullen.

  8. Voer in het vak 'Magnetisch indien binnen' een waarde in (in pixels) om te bepalen hoe dicht bij de neerzetbestemming de bezoeker moet komen voordat de bestemming magnetisch wordt en het AP-element automatisch naar de bestemming wordt getrokken.

    Als u hier een hogere waarde invoert, kan de bezoeker de neerzetbestemming gemakkelijker vinden.

  9. Voor makkelijke puzzels en de eenvoudige manipulatie van decorstukken hebt u hier genoeg aan. Als u echter sleepgrepen voor het AP-element wilt definiëren, de beweging van het AP-element wilt bijhouden terwijl het wordt gesleept en een actie wilt activeren wanneer het AP-element wordt neergezet, klikt u op de tab Geavanceerd.
  10. Als u wilt opgeven dat de bezoeker op een bepaald gebied van het AP-element moet klikken om het element te slepen, selecteert u in het menu Sleepgreep de optie Gebied in het AP-element. Vervolgens voert u de coördinaten in voor de bovenkant en de linkerkant en de breedte en hoogte van de sleepgreep.

    Deze optie is handig als de afbeelding binnen het AP-element een element bevat dat verwijst naar de mogelijkheid om te slepen, zoals een titelbalk of een handvat van een lade. Stel deze optie niet in als u wilt dat de bezoeker op een willekeurige plek in het AP-element mag klikken om het te slepen.

  11. Selecteer de gewenste optie voor Tijdens het slepen:
    • Selecteer Breng het element naar voren als het AP-element in de stapelvolgorde op de voorgrond moet worden geplaatst terwijl het wordt gesleept. Als u deze optie selecteert, kunt u het pop-upmenu gebruiken om op te geven of het AP-element op de voorgrond moet blijven of naar de oorspronkelijke positie in de stapelvolgorde moet terugkeren nadat het is gesleept.

    • Voer JavaScript-code of een functienaam (bijvoorbeeld monitorAPelement()) in het vak JavaScript aanroepen in als u de code of functie herhaaldelijk wilt uitvoeren terwijl het AP-element wordt gesleept. U kunt bijvoorbeeld een functie schrijven die de coördinaten van het AP-element in de gaten houdt en in een tekstvak aanwijzingen weergeeft, zoals “je wordt al warmer” of “het doel bevindt zich heel ergens anders”.

  12. Voer JavaScript-code of een functienaam (bijvoorbeeld evaluateAPelementPos()) in het tweede vak JavaScript aanroepen in als u de code of functie wilt uitvoeren wanneer het AP-element wordt neergezet. Selecteer Alleen bij bereiken van bestemming als de JavaScript-code alleen moet worden uitgevoerd als het AP-element de neerzetbestemming heeft bereikt.
  13. Klik op OK en controleer of de standaardgebeurtenis juist is.

Informatie verzamelen over het versleepbare AP-element

Wanneer u het gedrag AP-element slepen aan een object koppelt, voegt Dreamweaver de functie MM_dragLayer() in de kopsectie van uw document in. (De functie blijft de oude naamgevingsconventie voor AP-elementen (“Laag”) gebruiken, zodat lagen die in vorige versies van Dreamweaver zijn gemaakt, bewerkbaar blijven.) Deze functie registreert het AP-element niet alleen als versleepbaar, maar definieert daarnaast nog drie eigenschappen voor elk versleepbare AP-element: MM_LEFTRIGHT, MM_UPDOWN en MM_SNAPPED, die u in uw eigen JavaScript-functies kunt gebruiken om de relatieve horizontale en verticale positie van het AP-element te kunnen bepalen en om te kunnen bepalen of het AP-element de neerzetbestemming heeft bereikt.

Opmerking:

De informatie die hier wordt gegeven, is alleen bedoeld voor ervaren JavaScript-programmeurs.

Met de volgende functie wordt bijvoorbeeld de waarde van het eigenschap MM_UPDOWN (de huidige verticale positie van het AP-element) in een formulierveld met de naam curPosField weergegeven. (Formuliervelden zijn handig voor het weergeven van gegevens die voortdurend worden bijgewerkt omdat ze dynamisch zijn, dat wil zeggen dat u de inhoud kunt wijzigen nadat de pagina is geladen.)

function getPos(layerId){ 
    var layerRef = document.getElementById(layerId); 
    var curVertPos = layerRef.MM_UPDOWN; 
    document.tracking.curPosField.value = curVertPos; 
}

U kunt de waarden van MM_UPDOWN of MM_LEFTRIGHT in een formulierveld weergeven, maar u kunt deze waarden ook op diverse andere manieren gebruiken. U kunt bijvoorbeeld een functie schrijven waarmee verschillende berichten in een formulierveld kunnen worden weergegeven afhankelijk van de waarde die de positie van het AP-element ten opzichte van de neerzetbestemming aangeeft, of u kunt een andere functie aanroepen om een AP-element weer te geven of te verbergen afhankelijk van de waarde.

Dit is met name nuttig om de eigenschap MM_SNAPPED te lezen wanneer u verschillende AP-elementen op een pagina hebt, die allemaal hun eigen doel moeten bereiken voordat de bezoeker verder kan gaan naar de volgende pagina of taak. U kunt bijvoorbeeld een functie schrijven die telt hoeveel AP-elementen de MM_SNAPPED-waarde true hebben en deze aanroepen wanneer een AP-element wordt neergezet. Wanneer bij het tellen van de lagen die op hun bestemming zijn aangekomen het gewenste aantal is bereikt, kunt u de bezoeker naar de volgende pagina sturen of een bericht weergeven waarin u de bezoeker feliciteert met het behaalde resultaat.

Het gedrag Ga naar URL toepassen

Met het gedrag Ga naar URL wordt een nieuwe pagina geopend in het huidige venster of in het opgegeven frame. Dit gedrag is handig voor het wijzigen van de inhoud van twee of meer frames met één muisklik.

  1. Selecteer een object en kies Ga naar URL in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Selecteer een bestemming voor de URL in de lijst Openen in.

    In de lijst Openen in worden automatisch de namen van alle frames in de huidige frameset en ook het hoofdvenster weergegeven. Als er geen frames zijn, vormt het hoofdvenster de enige optie.

    Opmerking:

    Dit gedrag kan leiden tot onverwachte resultaten als een van de frames de naam top, blank, self of parent heeft. Browsers vatten deze namen soms op als gereserveerde doelnamen.

  3. Klik op Bladeren om een document te selecteren dat u wilt openen, of voer in het vak URL het pad en de bestandsnaam van het document in.
  4. Herhaal de stappen 2 en 3 om extra documenten in andere frames te openen.
  5. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Snelmenu toepassen

Wanneer u een snelmenu maakt met Invoegen > Formulier > Snelmenu, maakt Dreamweaver een menuobject en koppelt daaraan het gedrag Snelmenu (of Snelmenu Go). U hoeft het gedrag Snelmenu gewoonlijk niet handmatig aan een object te koppelen.

U kunt een bestaand snelmenu bewerken op een van de volgende twee manieren:

  • U kunt menu-items bewerken en opnieuw ordenen, de bestanden wijzigen waar bezoekers via het menu naartoe kunnen gaan en het venster wijzigen waarin deze bestanden worden geopend door te dubbelklikken op een bestaand gedrag Snelmenu in het deelvenster Gedrag.

  • U kunt de items in het snelmenu op dezelfde manier bewerken als items in elk ander menu, door het menu te selecteren en de knop Lijstwaarden in de eigenschappencontrole te gebruiken.

  1. Maak een snelmenuobject, als een dergelijk object nog niet in uw document aanwezig is.
  2. Selecteer het object en kies Snelmenu in het menu Gedrag toevoegen van het deelvenster Gedrag.
  3. Breng de gewenste wijzigingen aan in het dialoogvenster Snelmenu en klik vervolgens op OK.

Het gedrag Snelmenu Go toepassen

Het gedrag Snelmenu Go is nauw verwant met het gedrag Snelmenu. Met Snelmenu Go kunt u een knop Go (Ga naar) aan een snelmenu koppelen. (Voordat u dit gedrag gebruikt, moet er al een snelmenu in het document aanwezig zijn.) Als u op de knop Go klikt, wordt de koppeling geopend die in het snelmenu is geselecteerd. Voor een snelmenu is gewoonlijk geen knop Go nodig. Als er een item in het snelmenu wordt geselecteerd, wordt er gewoonlijk een URL geladen zonder dat de gebruiker verder iets hoeft te doen. Maar als de bezoeker hetzelfde item selecteert dat al in het snelmenu is gekozen, gaat de bezoeker niet naar de gewenste locatie. In het algemeen is dat niet erg, maar als het snelmenu in een frame verschijnt en de items in het snelmenu koppelingen zijn naar pagina's in andere frames, is een knop Go vaak nuttig om bezoekers de gelegenheid te bieden een item dat al is geselecteerd in het snelmenu, opnieuw te selecteren.

Opmerking:

Wanneer u een knop Go met een snelmenu gebruikt, wordt de Go-knop het enige mechanisme dat de gebruiker naar de URL brengt die aan de selectie in het menu is gekoppeld. Door een menu-item in het snelmenu te kiezen, wordt de gebruiker niet langer automatisch naar een andere pagina of een ander frame omgeleid.

  1. Selecteer een object dat u wilt gebruiken als de Go-knop (gewoonlijk een plaatje van een knop) en kies het gedrag Snelmenu Go in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Selecteer in het menu Snelmenu kiezen een menu dat met de Go-knop moet worden geactiveerd en klik op OK.

Het gedrag Browservenster openen toepassen

Gebruik het gedrag Browservenster openen om een pagina in een nieuw venster te openen. U kunt de eigenschappen van het nieuwe venster opgeven, zoals het formaat, de kenmerken (of het formaat kan worden gewijzigd, of het een menubalk heeft enzovoort) en de naam. U kunt dit gedrag bijvoorbeeld gebruiken om een grotere afbeelding in een afzonderlijk venster te openen als de bezoeker op een miniatuurafbeelding klikt. Met dit gedrag kunt u het nieuwe venster precies even groot maken als de afbeelding.

Als u geen kenmerken voor het venster opgeeft, krijgt het nieuwe venster dat wordt geopend, het formaat en de kenmerken van het venster van waaruit het is geopend. Als u een willekeurig kenmerk voor het venster opgeeft, worden automatisch alle andere kenmerken die niet specifiek zijn ingeschakeld, automatisch uitgeschakeld. Als u bijvoorbeeld geen kenmerken voor het venster instelt, wordt het mogelijk geopend als een venster van 1024 x 768 pixels groot met een navigatiebalk (waarop de knoppen Vorige, Volgende, Startpagina en Opnieuw laden worden weergegeven), een locatiewerkbalk (waarin de URL wordt weergegeven), een statusbalk onderaan (waarop statusberichten worden weergegeven) en een menubalk (met de menu's Bestand, Bewerken, Beeld en andere menu's). Als u expliciet de breedte op 640 pixels en de hoogte op 480 pixels instelt en geen andere kenmerken opgeeft, wordt er alleen een venster van 640 x 480 pixels groot, zonder werkbalken weergegeven.

  1. Selecteer een object en kies Browservenster openen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Klik op Bladeren om een bestand te selecteren of voer de URL in die u wilt weergeven.
  3. Stel opties in voor de vensterbreedte en -hoogte in (in pixels) en voor de plaatsing van verscheidene werkbalken, schuifbalken, formaatgrepen en dergelijke in het venster. Geef het venster een naam (gebruik geen spaties en geen speciale tekens) als u van het venster het doel van koppelingen wilt maken of als u het venster wilt besturen met JavaScript.
  4. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Pop-upbericht toepassen

Met het gedrag Pop-upbericht wordt een JavaScript-waarschuwing weergegeven met het bericht dat u opgeeft. Omdat JavaScript-waarschuwingen slechts één knop (OK) hebben, kunt u dit gedrag wel gebruiken om de gebruiker informatie te geven, maar niet om de gebruiker een keuze te laten maken.

U kunt elke geldige functie-aanroep, eigenschap, globale variabele of andere expressie in JavaScript in de tekst insluiten. Als u een JavaScript-expressie wilt insluiten, plaatst u deze binnen accolades ({}). Als u een accolade wilt weergeven, plaatst u een backslash voor de accolade (\{).

Voorbeeld:

The URL for this page is {window.location}, and today is {new Date()}.
Opmerking:

De browser bepaalt het uiterlijk van een waarschuwing. Als u meer controle wilt over het uiterlijk van een waarschuwing, kunt u overwegen om het gedrag Browservenster openen te gebruiken.

  1. Selecteer een object en kies Pop-upbericht in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Voer in het vak Bericht een bericht in.
  3. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Afbeeldingen vooraf laden toepassen

Met het gedrag Afbeeldingen vooraf laden worden afbeeldingen die in eerste instantie nog niet verschijnen wanneer de pagina wordt weergegeven, alvast in het cachegeheugen geladen waardoor ze sneller worden weergegeven wanneer ze aan de beurt zijn. (Dit gedrag is bijvoorbeeld handig voor afbeeldingen die andere afbeeldingen vervangen wanneer ze worden geactiveerd met gedrag of scripts.)

Opmerking:

Met het gedrag Afbeelding verwisselen worden alle geselecteerde afbeeldingen automatisch vooraf geladen wanneer u in het dialoogvenster Afbeelding verwisselen de optie Afbeeldingen vooraf laden selecteert, dus u hoeft Afbeeldingen vooraf laden niet handmatig toe te voegen wanneer u Afbeelding verwisselen gebruikt.

  1. Selecteer een object en kies Afbeeldingen vooraf laden in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Klik op Bladeren om een afbeeldingsbestand te selecteren of voer in het vak Bronbestand van afbeelding het pad en de bestandsnaam in.
  3. Klik op de plusknop (+) bovenaan in het dialoogvenster om de afbeelding aan de lijst Afbeeldingen vooraf laden toe te voegen.
  4. Herhaal de stappen 2 en 3 voor alle resterende afbeeldingen die u vooraf wilt laden op de huidige pagina.
  5. Als u een afbeelding uit de lijst Afbeeldingen vooraf laden wilt verwijderen, selecteert u de desbetreffende afbeelding in de lijst en klikt u op de minknop (–).
  6. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Tekst van frame instellen toepassen

Het gedrag Tekst van frame instellen biedt u de mogelijkheid om de tekst van een frame dynamisch in te stellen en de inhoud en opmaak van een frame te vervangen door de inhoud die u opgeeft. De inhoud kan bestaan uit elke geldige HTML-code. Gebruik dit gedrag om gegevens dynamisch weer te geven.

Hoewel u met het gedrag Tekst van frame instellen de opmaak van een frame kunt vervangen, kunt u Achtergrondkleur behouden selecteren om de achtergrond- en tekstkleurkenmerken van de pagina te handhaven.

U kunt elke geldige functie-aanroep, eigenschap, globale variabele of andere expressie in JavaScript in de tekst insluiten. Als u een JavaScript-expressie wilt insluiten, plaatst u deze binnen accolades ({}). Als u een accolade wilt weergeven, plaatst u een backslash voor de accolade (\{).

Voorbeeld:

The URL for this page is {window.location}, and today is {new Date()}.
  1. Selecteer een object en kies Tekst instellen > Tekst van frame instellen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Selecteer in het dialoogvenster Tekst van frame instellen het doelframe in het menu Frame.
  3. Klik op de knop Huidige HTML ophalen om de huidige inhoud van de hoofdsectie te kopiëren.
  4. Voer in het vak Nieuwe HTML een bericht in.
  5. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Tekst van container instellen toepassen

Met het gedrag Tekst van container instellen vervangt u de inhoud en opmaak van een bestaande container (dus elk element dat tekst of andere elementen kan bevatten) op een pagina door de inhoud die u opgeeft. De inhoud kan bestaan uit elke geldige HTML-broncode.

U kunt elke geldige functie-aanroep, eigenschap, globale variabele of andere expressie in JavaScript in de tekst insluiten. Als u een JavaScript-expressie wilt insluiten, plaatst u deze binnen accolades ({}). Als u een accolade wilt weergeven, plaatst u een backslash voor de accolade (\{).

Voorbeeld:

The URL for this page is {window.location}, and today is {new Date()}.
  1. Selecteer een object en selecteer Tekst instellen > Tekst van container instellen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Gebruik in het dialoogvenster Tekst van container instellen het menu Container om het doelelement te selecteren.
  3. Voer de nieuwe tekst of HTML in het vak Nieuwe HTML in.
  4. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Tekst van statusbalk instellen toepassen

Met het gedrag Tekst van statusbalk instellen kunt u een bericht weergeven in de linkerbenedenhoek van het browservenster. Dit gedrag kunt u bijvoorbeeld gebruiken om een beschrijving van het doel van een koppeling in de statusbalk weer te geven in plaats van de desbetreffende URL. Bezoekers van een website negeren berichten op de statusbalk vaak of zien ze over het hoofd (en niet alle browsers bieden volledige ondersteuning voor het instellen van de tekst van de statusbalk). Als uw boodschap belangrijk is voor bezoekers, kunt u het bericht misschien beter in de vorm van een pop-upbericht of als tekst van een AP-element weergeven.

Opmerking:

Als u het gedrag Tekst van statusbalk instellen in Dreamweaver gebruikt, verandert de tekst van de statusbalk in de browser niet gegarandeerd omdat sommige browsers speciale aanpassingen nodig hebben wanneer de tekst op de statusbalk verandert. Voor Firefox moet u bijvoorbeeld een geavanceerde optie instellen opdat JavaScript de tekst op de statusbalk kan wijzigen. Raadpleeg de documentatie bij uw browser voor nadere informatie.

U kunt elke geldige functie-aanroep, eigenschap, globale variabele of andere expressie in JavaScript in de tekst insluiten. Als u een JavaScript-expressie wilt insluiten, plaatst u deze binnen accolades ({}). Als u een accolade wilt weergeven, plaatst u een backslash voor de accolade (\{).

Voorbeeld:

The URL for this page is {window.location}, and today is {new Date()}.
  1. Selecteer een object en kies Tekst instellen > Tekst van statusbalk instellen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Typ het bericht in het vak Bericht van het dialoogvenster Tekst van statusbalk instellen.

    Houd het bericht beknopt. De browser kapt de tekst van het bericht af als de tekst niet op de statusbalk past.

  3. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Tekst van tekstveld instellen toepassen

Met het gedrag Tekst van tekstveld instellen vervangt u de inhoud van een tekstveld van een formulier door de inhoud die u opgeeft.

U kunt elke geldige functie-aanroep, eigenschap, globale variabele of andere expressie in JavaScript in de tekst insluiten. Als u een JavaScript-expressie wilt insluiten, plaatst u deze binnen accolades ({}). Als u een accolade wilt weergeven, plaatst u een backslash voor de accolade (\{).

Voorbeeld:

The URL for this page is {window.location}, and today is {new Date()}.

Een benoemd tekstveld maken

  1. Selecteer Invoegen > Formulier > Tekstveld.

    Als Dreamweaver u vraagt of u een formuliertag wilt toevoegen, klikt u op Ja.

  2. Typ in de eigenschappencontrole een naam voor het tekstveld. Zorg ervoor dat de naam uniek is op de pagina (gebruik niet dezelfde naam voor meerdere elementen op dezelfde pagina ook al bevinden deze elementen zich in verschillende formulieren).

Tekst van tekstveld instellen toepassen

  1. Selecteer een tekstveld en kies Tekst instellen > Tekst van tekstveld instellen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  2. Selecteer het doeltekstveld in het menu Tekstveld en voer de nieuwe tekst in.
  3. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Elementen tonen en verbergen toepassen

Met het gedrag Elementen tonen en verbergen kunt u elementen weergeven of verbergen of de standaardzichtbaarheid van een of meer elementen opnieuw instellen. Dit gedrag is handig voor het weergeven van informatie terwijl er interactie plaatsvindt tussen de gebruiker de pagina. U kunt bijvoorbeeld terwijl de gebruiker met de muisaanwijzer over de afbeelding van een plant gaat, een pagina-element weergeven met gedetailleerde informatie over de herkomst en de bloeiperiode van de plant, de hoeveelheid zon die de plant nodig geeft, hoe groot de plant kan worden enzovoort. Met het gedrag kunt u het desbetreffende element alleen weergeven of verbergen. U verwijdert het element niet werkelijk van de pagina wanneer u het verbergt.

  1. Selecteer een object en selecteer Elementen weergeven/verbergen in het menu Gedrag toevoegen van het deelvenster Gedrag.

    Als Elementen weergeven/verbergen niet beschikbaar is, hebt u waarschijnlijk een AP-element geselecteerd. Omdat AP-elementen geen gebeurtenissen in beide 4.0-browsers accepteren, moet u een ander object selecteren, bijvoorbeeld de <body>-tag of een koppeling (<a>-tag.

  2. Selecteer in de lijst Elementen het element dat u wilt weergeven of verbergen en klik op Weergeven, Verbergen of Herstellen (waarmee u de standaardzichtbaarheid herstelt).
  3. Herhaal stap 2 voor alle resterende elementen waarvan u de zichtbaarheid wilt wijzigen. (U kunt de zichtbaarheid van meerdere elementen tegelijk wijzigen met één gedrag.)
  4. Klik op OK en controleer of de standaardgebeurtenis juist is.

Dit gedrag wordt vanaf Dreamweaver CS5 niet meer ondersteund.

Het gedrag Afbeelding verwisselen toepassen

Met het gedrag Afbeelding verwisselen wordt een afbeelding vervangen door een andere door het src-kenmerk van de <img>-tag te wijzigen. Gebruik dit gedrag om knop-rollovers en andere afbeeldingseffecten te maken (inclusief het verwisselen van meerdere afbeeldingen tegelijk). Als u een rollover-afbeelding invoegt, wordt automatisch het gedrag Afbeelding verwisselen aan de pagina toegevoegd.

Opmerking:

Omdat alleen het src-kenmerk wordt beïnvloed door dit gedrag, moet u de oorspronkelijke afbeelding vervangen door een afbeelding met dezelfde afmetingen (hoogte en breedte). Als u dat niet doet, wordt de nieuwe afbeelding kleiner of groter gemaakt totdat deze binnen de afmetingen van de oorspronkelijke afbeelding past.

Het gedrag Omwisselen van afbeelding herstellen is ook beschikbaar. Hiermee kunt u voor de laatste set ingewisselde afbeeldingen de vorige bronbestanden herstellen. Dit gedrag wordt telkens automatisch toegevoegd wanneer u het gedrag Afbeelding verwisselen aan een object koppelt. Als u de hersteloptie geselecteerd laat terwijl u het gedrag Afbeelding verwisselen koppelt, hoeft u het gedrag Omwisselen van afbeelding herstellen nooit handmatig te selecteren.

  1. Selecteer Invoegen > Afbeelding of klik op de knop Afbeelding in het deelvenster Invoegen om een afbeelding in te voegen.
  2. Typ in de eigenschappencontrole een naam voor de afbeelding in het meest linkse tekstvak.

    Het is niet verplicht om afbeeldingen een naam te geven. Afbeeldingen krijgen automatisch een naam toegewezen wanneer u het gedrag aan een object koppelt. Het is echter gemakkelijker om afbeeldingen van elkaar te onderscheiden in het dialoogvenster Afbeelding verwisselen als u alle afbeeldingen vooraf een naam geeft.

  3. Herhaal de stappen 1 en 2 om extra afbeeldingen in te voegen.
  4. Selecteer een object (gewoonlijk de afbeelding die u gaat verwisselen) en kies Afbeelding verwisselen in het menu Gedrag toevoegen van het deelvenster Gedrag.
  5. Selecteer in de lijst Afbeeldingen de afbeelding waarvan u de bron wilt wijzigen.
  6. Klik op Bladeren om het nieuwe afbeeldingsbestand te selecteren of voer in het vak 'Bron instellen op' het pad en de bestandsnaam van de nieuwe afbeelding in.
  7. Herhaal de stappen 5 en 6 voor eventuele extra afbeeldingen die u wilt wijzigen. Gebruik dezelfde actie Afbeelding verwisselen voor alle afbeeldingen die u in één keer wilt wijzigen, anders worden met de corresponderende actie Omwisselen van afbeeldingen herstellen niet alle oorspronkelijke afbeeldingen hersteld.
  8. Selecteer de optie Afbeeldingen vooraf laden om de nieuwe afbeeldingen alvast in het cachegeheugen te laden wanneer de pagina wordt geladen.

    Hiermee voorkomt u downloadvertragingen op het moment dat de nieuwe afbeeldingen moeten verschijnen.

  9. Klik op OK en controleer of de standaardgebeurtenis juist is.

Het gedrag Formulier valideren toepassen

Met het gedrag Formulier valideren kunt u de inhoud van opgegeven tekstvelden controleren om na te gaan of de gebruiker het juiste type gegevens heeft ingevoerd. Koppel dit gedrag aan afzonderlijke tekstvelden met de gebeurtenis onBlur om de velden te valideren terwijl de gebruiker het formulier invult of koppel het gedrag aan het formulier met de gebeurtenis onSubmit om verschillende tekstvelden tegelijk te evalueren wanneer de gebruiker op de knop Verzenden klikt. Door dit gedrag aan een formulier te koppelen, kunt u voorkomen dat er formulieren met ongeldige gegevens worden ingezonden.

  1. Selecteer Invoegen > Formulier of klik op de knop Formulier in het deelvenster Invoegen om een formulier in te voegen.
  2. Selecteer Invoegen > Formulier > Tekstveld of klik op de knop Tekstveld in het deelvenster Invoegen om een tekstveld in te voegen.

    Herhaal deze stap om extra tekstvelden in te voegen.

  3. Kies een validatiemethode:
    • Als u afzonderlijke velden wilt valideren terwijl de gebruiker het formulier invult, selecteert u een tekstveld en selecteert u Venster > Gedrag.

    • Als u meerdere velden wilt valideren terwijl de gebruiker het formulier indient, klikt u op de <form>-tag in de tagkiezer in de linkerbenedenhoek van het documentvenster en kiest u Venster > Gedrag.

  4. Selecteer Formulier valideren in het menu Gedrag toevoegen.
  5. Voer een van de volgende handelingen uit:
    • Als u afzonderlijke velden wilt valideren, selecteert u hetzelfde veld dat u in de lijst Velden in het documentvenster hebt geselecteerd.

    • Als u meerdere velden ineens wilt valideren, selecteert u een tekstveld in de lijst Velden.

  6. Selecteer de optie Vereist als er gegevens in het veld moeten worden ingevuld.
  7. Selecteer een van de volgende opties voor Accepteren:

    Iets

    Hiermee controleert u of een verplicht veld gegevens bevat. Dit kunnen gegevens zijn van elk willekeurig type. 

    E‑mailadres

    Hiermee controleert u of het veld het symbool @ bevat.

    Getal

    Hiermee controleert u of het veld uitsluitend cijfers bevat.

    Getal vanaf

    Hiermee controleert u of het veld een getal bevat dat binnen een specifiek bereik valt.

  8. Als u ervoor hebt gekozen om meerdere velden te valideren, herhaalt stap 6 en 7 voor alle velden die u wilt valideren.
  9. Klik op OK.

    Als u meerdere velden valideert wanneer de gebruiker het formulier indient, wordt de gebeurtenis onSubmit automatisch in het menu Gebeurtenissen weergegeven.

  10. Als u afzonderlijke velden valideert, moet u controleren of de standaardgebeurtenis onBlur of onChange is. Als dat niet het geval is, moet u een van deze gebeurtenissen selecteren.

    Beide gebeurtenissen activeren het gedrag Formulier valideren wanneer de gebruiker zich met de aanwijzer van het veld af beweegt. Het verschil is dat onBlur altijd plaatsvindt, ongeacht of de gebruiker iets in het veld heeft getypt, en dat onChange alleen plaatsvindt als de gebruiker de inhoud van het veld heeft gewijzigd. De gebeurtenis onBlur heeft de voorkeur als het veld een verplicht veld is.

Krijg sneller en gemakkelijker hulp

Nieuwe gebruiker?