Kuidas luua Dreamweaveris lihtsat ümberminekupilti

Üleminek on nii populaarne funktsioon, et Dreamweaver sisaldab spetsiaalset dialoogiboksi, mis on mõeldud ainult ümbermineku jaoks: dialoogiboks Insert Rollover Image. Nagu nimigi viitab, on kursorpildid loodud reageerima, kui keegi viib kursori pildi kohale. Mõju võib olla sama dramaatiline kui koerapilt, mis asendub lõvipildiga, või nii peen kui sõna muutumine.

Saate luua keerukamaid ümberpööratud pildiefekte, kasutades valikut Vaheta pilt paneelil Käitumised. Suvand Vaheta pilt võimaldab teil korraga mitut pilti muuta.

Kahe pildiga lihtsa ümberlülitusefekti loomiseks Dreamweaveri dialoogiboksi Pildi ümbermineku lisamine abil toimige järgmiselt.

Viige kursor lehele, kuhu soovite kursorit kuvada.

Üleminekuefektid nõuavad vähemalt kahte pilti: ühte algoleku ja teist ümbermineku oleku jaoks. Võite kasutada kahte erinevat või kahte sarnast pilti, kuid mõlemal peaks olema samad mõõtmed. Vastasel juhul näete kummalisi skaleerimisefekte, kuna mõlemad pildid peavad olema kuvatud lehel täpselt samal alal.

Valige Lisa → Pilt → Üleminekupilt.

Teise võimalusena võite kasutada ripploendit, mis on saadaval paneelil Common Insert ikoonil Images (Kujutised), ja valida suvandi Rollover Image.

Ilmub dialoogiboks Insert Rollover Image.

Nimetage pildi nimi kastis Pildi nimi.

Enne kui saate elemendile (nt pildile) käitumist rakendada, peab elemendil olema nimi, et käitumisskript saaks sellele viidata. Saate nimetada elemente mida iganes soovite, kui te ei kasuta tühikuid ega erimärke.

Määrake kastis Algne pilt esimene pilt, mida soovite näha. Kasutage pildi leidmiseks ja valimiseks nuppu Sirvi.

Kui pilte pole veel teie kohalikus saidi kaustas, kopeerib Dreamweaver need teie saidile, kui loote üleminek.

Sisestage väljale Rollover Image pilt, mille soovite nähtavaks saada, kui külastaja viib kursori esimese pildi kohale.

Jällegi saate pildi asukoha leidmiseks ja valimiseks kasutada nuppu Sirvi.

Märkige ruut Preload Rollover Image, et laadida kõik üleminekpildid lehe esmakordsel laadimisel brauseri vahemällu.

Kui te seda sammu ei tee, võivad külastajad kogeda viivitust, kuna teist pilti ei laadita alla enne, kui kursor liigutatakse üle algse pildi.

Sisestage väljale Alternatiivne tekst piltide kirjeldus.

Alternatiivne tekst on valikuline, kuid soovitatav, kuna märksõnade kasutamine võib parandada otsingumootori optimeerimist. Samamoodi on alternatiivtekst veebijuurdepääsetavuse oluline osa, kuna seda teksti loevad ette spetsiaalsed brauserid, mida nimetatakse ekraanilugejateks ja mida kasutavad pimedad ja teised piiratud nägemis- või liikumisvõimega inimesed. Alternatiivne tekst kuvatakse brauseris ainult siis, kui pildid pole nähtavad.

Sisestage väljale Klõpsamisel Mine URL-ile mis tahes veebiaadress või sirvige, et leida oma saidil mõni muu leht, millele soovite linkida.

Kui te URL-i ei määra, lisab Dreamweaver automaatselt koodi kohahoidjana märgi #.

Märk # on levinud meetod linkide loomiseks, mis ei lingi kuhugi. Kuna ümbermineku piltidel, mis ei viita teisele lehele, on palju suurepäraseid kasutusvõimalusi, on see tehnika kasulik. Pidage lihtsalt meeles, et kui soovite, et kursoriga kursis oleks link, peate asendama märgi # lingiga teisele lehele.

Klõpsake nuppu OK.

Pildid seadistatakse automaatselt ümberminekuna.

Ülemineku nägemiseks salvestage fail ja seejärel klõpsake tööala ülaosas maakera ikooni, et vaadata oma lehekülge veebibrauseris eelvaateks.

Saate vaadata, kuidas üleminek töötab Dreamweaveri kujundusvaates või kasutades suvandit Otsevaade. Kui klõpsate tööala vasakus ülanurgas nuppu Live, muudate Dreamweaveri sisuliselt veebibrauseriks, mis kuvab lehti sarnaselt Chrome'i brauseriga.

Kui vaatate arvutis lehe eelvaadet, mis sisaldab ümberpööramispilti, kuvavad mõned veebibrauserid hoiatuse selle kohta, et peate lubama ActiveX-juhtelementidel lehe vaatamiseks. See on turvahoiatus, mis kuvatakse ainult siis, kui leht avatakse samas arvutis, kuhu leht on salvestatud.

Kui avaldate lehe veebiserveris ja vaatate seda seejärel Interneti-ühenduse kaudu, ei näe teie ega teie saidi külastajad seda viga.

Krediit: istockphoto.com-i kunstiteos