Samouczek tworzenia obrazu najazdu w programie Dreamweaver

Obraz najazdu jest obrazem, który zmienia się na inny obraz, gdy ty lub twój klient rzucasz na niego myszą. Są one powszechnie używane do tworzenia interaktywnych odczuć, takich jak przyciski lub zakładki. Ale możesz tworzyć obrazy najazdu z niemal wszystkiego.

Ten samouczek został zaprojektowany w celu ułatwienia tworzenia obrazu najazdu w programie Dreamweaver. Jest przeznaczony do użytku przez osoby używające następujących wersji programu Dreamweaver:

• Dreamweaver MX
• Dreamweaver MX 2004
• Dreamweaver 8
• Dreamweaver CS3
• Dreamweaver CS4
• Dreamweaver CS5
• Dreamweaver CS6

Wymagania dotyczące tego samouczka

• DreamweaverJedna z powyższych wersji.
• Oryginalny obrazUpewnij się, że zoptymalizujesz ten obraz. Pomoże to szybciej ładować strony.
• Obraz najazduTen obraz powinien mieć te same wymiary co oryginalny obraz. I, podobnie jak oryginalny obraz, powinien być zoptymalizowany, aby pomóc w czasie ładowania strony.
• Strona internetowaTo jest strona HTML, na której umieścisz obraz najazdu.

Zaczynać

1. Uruchom program Dreamweaver
2. Otwórz stronę internetową, na której chcesz najechać rollover

Wstaw obiekt obrazu po najeździe

Dreamweaver ułatwia utworzenie obrazu najazdu.

1. Przejdź do menu Wstaw i w dół do Obiekty obrazu podmenu.
2. Wybierz Rolowanie obrazu lub Obraz najazdu.

Niektóre starsze wersje programu Dreamweaver wywołują zamiast tego obrazy obiektów "Interaktywne obrazy".

Powiedz Dreamweaver Jakie obrazy użyć

Dreamweaver wyświetla okno dialogowe z polami, które należy wypełnić, aby utworzyć obraz najazdu.

Nazwa obrazu

Wybierz nazwę obrazu, która jest unikalna dla strony. Powinno to być jedno słowo, ale możesz używać liczb, podkreśleń (_) i myślników (-). Zostanie to wykorzystane do identyfikacji obrazu do zmiany.

Oryginalny obraz

To jest adres URL lub lokalizacja obrazu, który rozpocznie się na stronie. W tym polu możesz używać względnych lub bezwzględnych adresów URL ścieżek. Powinien to być obraz, który istnieje na twoim serwerze internetowym lub który prześlesz ze stroną.

Obraz najazdu

Jest to obraz, który pojawi się po najechaniu myszą na obrazek. Podobnie jak oryginalny obraz, może to być bezwzględna lub względna ścieżka do obrazu i powinna istnieć lub zostać przesłana podczas przesyłania strony.

Wstępnie załaduj obraz po najeździe

Ta opcja jest wybrana domyślnie, ponieważ pomaga szybciej wyświetlać najazd. Wybierając wstępnie załadowany obraz najazdu, przeglądarka internetowa przechowuje go w pamięci podręcznej, dopóki mysz nie przewróci go.

Alternatywny tekst

Dobry tekst alternatywny sprawia, że ​​Twoje zdjęcia są bardziej dostępne. Powinieneś zawsze używać jakiegoś tekstu alternatywnego podczas dodawania jakichkolwiek obrazów.

Po kliknięciu Przejdź do adresu URL

Większość ludzi kliknie obraz, gdy zobaczy go na stronie. Więc powinieneś mieć zwyczaj ich klikać. Ta opcja umożliwia określenie strony lub adresu URL, pod który użytkownik zostanie kliknięty, gdy kliknie obraz. Ta opcja nie jest jednak wymagana do utworzenia przejścia.

Po zakończeniu wszystkich pól kliknij dobrze aby Dreamweaver tworzył obraz najazdu.

Dreamweaver Zapisuje skrypt JavaScript dla Ciebie

Jeśli otworzysz stronę w widoku kodu zobaczysz, że Dreamweaver wstawia blok JavaScript w dokumentu HTML. Ten blok zawiera 3 funkcje, które należy zamienić na obrazki, gdy mysz przewróci się nad nimi i funkcję wstępnego ładowania, jeśli zdecydowałeś się na to.

funkcja MM_swapImgRestore ()funkcja MM_findObj (n, d)funkcja MM_swapImage ()funkcja MM_preloadImages ()

Dreamweaver Dodaje HTML do najazdu

Jeśli zdecydujesz się na wczytanie obrazów trybu najazdu z programu Dreamweaver, zobaczysz kod HTML w treści dokumentu, aby zadzwonić do skryptu wstępnego ładowania, aby obrazy ładowały się szybciej.

onload = "MM_preloadImages (" shasta2.jpg ")"

Dreamweaver dodaje również cały kod do obrazu i łączy go (jeśli podałeś adres URL). Część najazdu jest dodawana do znacznika zakotwiczenia jako atrybuty onmouseover i onmouseout.

onmouseout = "MM_swapImgRestore ()"onmouseover = "MM_swapImage (" Obraz1 "," "," shasta1.jpg ", 1)"

Przetestuj przewrót

Zobacz w pełni funkcjonalny obraz najazdu i dowiedz się, co jest w umyśle Shasta.