Wyświetl dokument programu Dreamweaver w widoku Projekt lub Kod i zaznacz element, do którego chcesz zastosować efekt jQuery.
Ekscytujące efekty jQuery umożliwiają projektowanie ciekawych serwisów WWW. Integracja programu Dreamweaver z biblioteką jQuery umożliwia stosowanie efektów takich jak suwaki bez potrzeby programowania kodu.
Dodawanie efektów jQuery
Wybierz polecenie Okna > Zachowania, aby otworzyć panel Zachowania.
Kliknij ikonę Plus, kliknij Efekty, a następnie kliknij wymagany efekt.
Zostanie wyświetlony panel dostosowań z ustawieniami dla wybranego efektu.
Określ ustawienia takie jak element docelowy, do którego stosowany jest obiekt, oraz czas trwania efektu.
Elementem docelowym może być początkowo zaznaczony element albo inny element na stronie. Na przykład jeśli po kliknięciu elementu A ma być ukrywany lub pokazywany element B, to B będzie elementem docelowym.
Aby dodać wiele efektów jQuery, powtórz opisane powyżej kroki.
W przypadku wybrania wielu efektów program Dreamweaver zastosuje je w takiej kolejności, w jakiej są wyświetlone w panelu Zachowania. Aby zmienić kolejność efektów, skorzystaj ze strzałek w górnej części panelu.
Program Dreamweaver automatycznie wstawi odpowiedni kod do dokumentu. Na przykład jeśli wybrano efekt „Zanik”, wstawiony zostanie następujący kod:
- Zewnętrzne odwołania do plików zależnych wymaganych do działania efektów jQuery:
<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>
- Następujący kod zostanie zastosowany do elementu wewnątrz znacznika Body:
<li id="earthFrm" onclick="MM_DW_effectAppearFade($('#earthForms'),'show','fade',1000)"> Earth Forms</li>
- Dodany zostanie znacznik Script i następujący kod:
<script type="text/javascript"> function MM_DW_effectAppearFade(obj,method,effect,speed) { obj[method](effect, {}, speed); }</script>
Efekty jQuery oparte na zdarzeniach
Efekt jQuery zastosowany na stronie jest domyślnie przypisywany do zdarzenia onClick („po kliknięciu”). Zdarzenie wyzwalające efekt można zmienić za pomocą panelu Zachowania.
Zaznacz odpowiedni element strony.
W panelu Okna > Zachowania kliknij ikonę Pokaż zdarzenia ustawione.
Kliknij wiersz odpowiadający zastosowanemu obecnie efektowi. Pierwsza kolumna zmieni się w rozwijaną listę, z której można wybrać różne zdarzenia.
Kliknij odpowiednie zdarzenie.
Usuwanie efektów jQuery
Zaznacz odpowiedni element strony.
Panel Zachowania zawiera listę wszystkich efektów zastosowanych obecnie do zaznaczonego elementu strony.
Kliknij efekt, który chcesz usunąć, a następnie kliknij ikonę Usuń.
Tworzenie estetycznych serwisów internetowych w programie Dreamweaver
Projektowanie, pisanie kodu i zarządzanie dynamicznymi serwisami internetowymi za pomocą jednego, kompleksowego narzędzia.