Hvernig á að búa til einfalda veltumynd í Dreamweaver

Rollovers eru svo vinsæll eiginleiki að Dreamweaver inniheldur sérstakan glugga bara fyrir rollovers: Insert Rollover Image valmyndina. Rúllumyndir, eins og nafnið gefur til kynna, eru hannaðar til að bregðast við þegar einhver veltir bendili yfir mynd. Áhrifin geta verið eins dramatísk og mynd af hundi sem er skipt út fyrir mynd af ljóni, eða eins lúmskur og litur orðs sem breytist.

Þú getur búið til flóknari veltimyndaráhrif með valkostinum Skipta um mynd frá Hegðun spjaldið. Valkosturinn Skipta um mynd gerir þér kleift að breyta mörgum myndum á sama tíma.

Til að búa til einföld veltunaráhrif með tveimur myndum með því að nota Insert Image Rollover valmynd Dreamweaver skaltu fylgja þessum skrefum:

Settu bendilinn á síðuna þar sem þú vilt að veltingurinn birtist.

Veltingaráhrif þurfa að minnsta kosti tvær myndir: eina fyrir upphafsstöðu og eina fyrir veltistöðu. Þú getur notað tvær mismunandi myndir eða tvær svipaðar, en báðar ættu að hafa sömu stærðir. Annars sérðu undarleg stærðaráhrif vegna þess að báðar myndirnar verða að birtast á nákvæmlega sama rými á síðunni.

Veldu Setja inn→ Mynd→ Rúllumynd.

Að öðrum kosti geturðu notað fellilistann sem er tiltækur frá myndtákninu á Common Insert spjaldinu og valið Rollover Image.

Valmyndin Insert Rollover Image birtist.

Í Image Name reitnum, gefðu myndinni þinni nafn.

Áður en hægt er að beita hegðun á frumefni, eins og mynd, verður þátturinn að hafa nafn svo að hegðunarforritið geti vísað í það. Þú getur nefnt þætti hvað sem þér líkar svo lengi sem þú notar ekki bil eða sérstafi.

Í Upprunalega mynd reitnum, tilgreindu fyrstu myndina sem þú vilt sjá. Notaðu Browse hnappinn til að finna og velja myndina.

Ef myndirnar eru ekki þegar í möppunni á staðnum, afritar Dreamweaver þær inn á síðuna þína þegar þú býrð til rollover.

Í Rollover Image reitnum, sláðu inn myndina sem þú vilt að verði sýnileg þegar gestur færir bendilinn yfir fyrstu myndina.

Aftur geturðu notað Browse hnappinn til að finna og velja myndina.

Veldu Preload Rollover Image gátreitinn til að hlaða öllum rollover myndum í skyndiminni vafrans þegar síðan er fyrst hlaðið.

Ef þú velur ekki að gera þetta skref gætu gestir þínir orðið fyrir töf vegna þess að annarri myndinni verður ekki hlaðið niður fyrr en bendilinn er rúllaður yfir upprunalegu myndina.

Í reitnum Varatexti skaltu slá inn lýsingu á myndunum.

Annar texti er valfrjáls en mælt er með því að nota leitarorð getur aukið leitarvélabestun. Að sama skapi er varatexti lykilþáttur í aðgengi að vefnum vegna þess að þessi texti er lesinn upp af sérstökum vöfrum sem kallast skjálesarar, sem eru notaðir af blindu fólki og öðrum með takmarkaða sjón eða hreyfigetu. Annar texti birtist aðeins í vafranum ef myndirnar eru ekki sýnilegar.

Sláðu inn hvaða veffang sem er eða flettu til að finna aðra síðu á síðunni þinni sem þú vilt tengja í reitinn Þegar smellt er á, Farðu á URL.

Ef þú tilgreinir ekki vefslóð setur Dreamweaver # táknið sjálfkrafa inn sem staðgengil í kóðann.

# táknið er algeng tækni til að búa til tengla sem tengjast hvergi. Vegna þess að rúllumyndir sem tengjast ekki á aðra síðu hafa marga frábæra notkun er þessi tækni gagnleg. Mundu bara að ef þú vilt að veltingurinn þinn tengist þarftu að skipta út # merkinu fyrir tengil á aðra síðu.

Smelltu á OK.

Myndirnar eru settar upp sjálfkrafa sem rollover.

Til að sjá veltingu í aðgerð, vistaðu skrána og smelltu síðan á hnattartáknið efst á vinnusvæðinu til að forskoða síðuna þína í vafra.

Þú getur séð hvernig veltingurinn þinn virkar í hönnunarskjá Dreamweaver eða með því að nota Live view valkostinn. Þegar þú smellir á Live hnappinn efst til vinstri á vinnusvæðinu breytir þú Dreamweaver í raun í vafra sem sýnir síður svipað og Chrome vafra.

Þegar þú ert að forskoða síðu á tölvunni þinni sem inniheldur rúllumynd, birta sumir vafrar viðvörun um að þú verður að leyfa ActiveX stýringu að skoða síðuna. Þetta er öryggisviðvörun sem birtist aðeins þegar síðan er opnuð á sömu tölvu og síðan er vistuð.

Ef þú birtir síðuna á vefþjóni og skoðar hana síðan í gegnum nettengingu muntu og gestir síðunnar þínar ekki sjá þessa villu.

Inneign: Listaverk eftir istockphoto.com