Operation Manual

Werken met de widget Spry-knopinfo
Opmerking:
Naar boven
Naar boven
Opmerking:
Naar boven
Over de knopinfo-widget
De knopinfo-widget invoegen
Opties voor knopinfo-widget bewerken
In Dreamweaver CC en hoger zijn Spry-widgets vervangen door jQuery-widgets. U kunt de bestaande Spry-widgets op uw pagina
nog steeds wijzigen, maar u kunt geen nieuwe Spry-widgets toevoegen.
Over de knopinfo-widget
Met de Spry-knopinfo-widget wordt aanvullende informatie weergegeven wanneer een gebruiker met de muis over een bepaald element op een
webpagina beweegt. De aanvullende inhoud verdwijnt wanneer de gebruiker niet meer boven het element beweegt. U kunt ook knopinfo instellen
om langer geopend te blijven zodat gebruikers iets met de inhoud van de knopinfo kunnen doen.
Een knopinfo-widget bestaat uit de volgende drie elementen:
De knopinfo-container. Dit is het element dat het bericht of de inhoud bevat die u wilt weergeven wanneer de gebruiker de knopinfo activeert.
De pagina-elementen die de knopinfo activeren.
Het constructor-script. Dit is JavaScript dat Spry opdraagt de knopinfo-functionaliteit te maken.
Wanneer u een knopinfo-widget invoegt, maakt Dreamweaver een knopinfo-container met behulp van div-tags en omhult het “trigger”-element
(het pagina-element dat de knopinfo activeert) met span-tags. Deze tags worden standaard door Dreamweaver gebruikt, maar de tags voor het
knopinfo- en het trigger-element kunnen alle tags zijn, mits deze zich in het hoofdtekstgedeelte van de pagina bevinden.
Denk aan de volgende punten wanneer u met de knopinfo-widget werkt:
Een geopende knopinfo wordt gesloten voordat de volgende wordt geopend.
Knopinfo blijft in beeld zolang de gebruiker boven het triggergebied beweegt.
Er zijn geen beperkingen aan het soort tags dat u kunt gebruiken voor triggers en voor knopinfo-inhoud. (Elementen op blokniveau zijn
echter altijd aan te raden, om mogelijke weergaveproblemen tussen verschillende browsers te voorkomen.)
Standaard wordt de knopinfo 20 pixels rechtsonder de cursor weergegeven. U kunt de opties voor horizontale en verticale verschuiving in de
eigenschappencontrole gebruiken om een ander weergavepunt op te geven.
Op dit moment is het nog niet mogelijk om knopinfo weer te geven terwijl een pagina in een browser wordt geladen.
Voor de knopinfo-widget is bijzonder weinig CSS nodig. Spry gebruikt JavaScript om de knopinfo weer te geven, te verbergen en te plaatsen.
Andere stijlkenmerken voor de knopinfo kunt u met standaard-CSS-technieken bereiken, volgens de vereisten van de pagina. De enige regel in
het standaard-CSS-bestand is een oplossing voor problemen met Internet Explorer 6 zodat de knopinfo boven formulierelementen of Flash-
objecten wordt weergegeven.
Zie www.adobe.com/go/learn_dw_sprytooltip_nl voor een uitgebreidere uitleg van de werking van de Spry-knopinfo-widget, inclusief een volledige
anatomie van de widgetcode.
Zie www.adobe.com/go/lrvid4046_dw_nl als u een video wilt bekijken waarin wordt uitgelegd hoe u met de Spry-knopinfo-widget werkt.
De knopinfo-widget invoegen
Selecteer Invoegen > Spry > Spry-knopinfo.
U kunt een knopinfo-widget ook invoegen met behulp van de categorie Spry in het deelvenster Invoegen.
Hiermee wordt een nieuwe knopinfo-widget met een container voor de inhoud van de knopinfo ingevoegd, plus een tijdelijke aanduiding in de vorm
van een zin, die als trigger voor de knopinfo dient.
U kunt ook een bestaand element op de pagina selecteren (bijvoorbeeld een afbeelding) en vervolgens de knopinfo invoegen. Wanneer u dit doet,
werkt het door u geselecteerde element als de nieuwe trigger van de knopinfo. De selectie moet een volledig tag-element zijn (bijvoorbeeld een
img-tag of een p-tag), zodat Dreamweaver er een id aan kan toewijzen, als dat nog niet is gebeurd.
Opties voor knopinfo-widget bewerken
371