jQuery-effecten gebruiken in Dreamweaver

Zoeken
Adobe Dreamweaver Handboek

Op deze pagina

Is van toepassing op: Adobe Dreamweaver

某些 Creative Cloud 应用程序、服务和功能在中国不可用。

Ontwerp boeiende websites ontwerpen met behulp van coole jQuery-effecten. Door de integratie van Dreamweaver met jQuery kunt u effecten, zoals schuifregelaars, invoegen zonder code te schrijven.

jQuery-effecten toevoegen

  1. Selecteer in de ontwerpweergave of codeweergave van uw Dreamweaver-document het element waarop u een jQuery-effect wilt toepassen.

  2. Selecteer Venster > Gedrag om het deelvenster Gedrag te openen.

  3. Klik op het plusteken, klik vervolgens op Effecten en klik tenslotte op het gewenste effect.

    jQuery-effecten toevoegen
    jQuery-effecten toevoegen

    Het aanpassingsdeelvenster met de instellingen voor het geselecteerde effect wordt weergegeven.

  4. Geef de instellingen op, zoals het doelelement waarop het effect moet worden toegepast en de duur van het effect.

    Het doelelement kan het element zijn dat u oorspronkelijk hebt geselecteerd of een ander element op de pagina. Als u bijvoorbeeld wilt dat gebruikers op een element A klikken om een element B te verbergen of weer te geven, is het doelelement B.

  5. Herhaal de bovenstaande stappen om meerdere jQuery-effecten toe te voegen.

    Wanneer u meerdere effecten kiest, worden de effecten in Dreamweaver toegepast in de volgorde waarin ze in het deelvenster Gedrag worden weergegeven. Als u de volgorde van de effecten wilt wijzigen, gebruikt u de pijltoetsen boven aan het deelvenster.

Dreamweaver voegt automatisch de relevante code in uw document in. Als u bijvoorbeeld het effect 'Vervagen' hebt geselecteerd, wordt de volgende code ingevoegd:

  • Externe bestandverwijzingen voor de afhankelijke bestanden die vereist zijn de werking van jQuery-effecten:
<script src="jQueryAssets/jquery-1.7.2.min.js" type="text/javascript"></script><script src="jQueryAssets/jquery-ui-effects.custom.min.js" type="text/javascript"></script>
  • De volgende code wordt toegepast op het element in de body-tag: 
<li id="earthFrm" onclick="MM_DW_effectAppearFade($('#earthForms'),'show','fade',1000)"> Earth Forms</li>
  • Een scripttag wordt samen met de volgende code toegevoegd:
<script type="text/javascript"> function MM_DW_effectAppearFade(obj,method,effect,speed) { obj[method](effect, {}, speed); }</script>

Op gebeurtenissen gebaseerde jQuery-effecten

Wanneer u een jQuery-effect toepast, wordt het effect standaard toegewezen aan de gebeurtenis onClick. U kunt de gebeurtenis voor activering van het effect wijzigen met het deelvenster Gedrag.

  1. Selecteer het gewenste pagina-element.

  2. Klik in het deelvenster Venster > Gedrag op het pictogram Gebeurtenissen instellen weergeven.

  3. Klik op de rij die overeenkomt met het effect dat momenteel is toegepast. De eerste kolom in een vervolgkeuzelijst verandert in een lijst met gebeurtenissen waaruit u kunt kiezen.

  4. Klik op de gewenste gebeurtenis.

jQuery-effecten verwijderen

  1. Selecteer het gewenste pagina-element.

    In het deelvenster Gedrag worden alle effecten weergegeven die momenteel zijn toegepast op het geselecteerde pagina-element.

  2. Klik op het effect dat u wilt verwijderen en klik vervolgens op het pictogram Verwijderen.

Dit werk is gelicentieerd onder de Creative Commons Naamsvermelding/Niet-commercieel/Gelijk delen 3.0 Unported-licentie  De voorwaarden van Creative Commons zijn niet van toepassing op Twitter™- en Facebook-berichten.

Juridische kennisgevingen   |   Online privacybeleid