Hvernig á að búa til skipti með mörgum myndum í Dreamweaver

Áður en þú byrjar að búa til flóknari síðuhönnun með Dreamweaver's Swap Image hegðun skaltu skoða fullbúna síðu. Með hegðun Skipta um mynd geturðu skipt út hvaða mynd sem er eða allar myndir á síðu.

Þegar þú notar hegðun Skipta um mynd er mikilvægt að gera allar myndir sem þú munt skipta um í sömu stærð (hæð og breidd). Ef myndirnar eru ekki í sömu stærð verða allar myndir nema sú fyrsta teygð eða þjappað saman til að passa við plássið sem fyrsta myndin sem sett er inn á síðuna tekur.

Ef þú ert að nota hegðun Skipta um mynd með röð mynda sem eru ekki allar í sömu hæð og breidd, hefurðu nokkra möguleika:

Skerið þær stærri þannig að allar myndirnar séu í sömu stærð.

Láttu láréttar og lóðréttar myndir taka upp sama pláss í hönnun þinni með því að sameina tvær lóðréttar myndir fyrir hverja lárétta. Búðu einfaldlega til skrá í forriti eins og Photoshop, settu tvær lóðréttar myndir inn í sömu skrána hlið við hlið og stærððu síðan myndina þannig að skráin sé í sömu stærð og ein lárétt mynd.

Búðu til eina myndaskrá á stærð við stærstu myndina þína, stilltu bakgrunninn á hlutlausan lit, eins og svartan eða hvítan, og settu síðan allar aðrar myndir inn á bakgrunninn svo þú getir vistað þær allar með sömu skráarstærð.

Fylgdu þessum skrefum til að nota hegðun Skipta um mynd:

1Búðu til síðuhönnun með öllum myndunum sem þú vilt birtast í upphafi.

Hver af þremur myndunum í síðuhönnun fyrir Tower Bridge í London hefur tvö eintök: eina smámynd og eina stærri útgáfu. Þegar síðan er fyrst hlaðið inn í vafra eru allar þrjár smámyndir staðsettar neðst á síðunni, með fyrstu samsvarandi stærri útgáfum á aðalsvæðinu rétt fyrir ofan smámyndirnar.

2Nefndu myndirnar þínar í fasteignaeftirlitinu.

Til að miða á myndirnar þínar með JavaScript, sem er hvernig hegðun virkar, gefðu fyrst hverri mynd einstakt auðkenni. Myndauðkennið er ekki það sama og myndskráarnafnið eða textamerkið, þó þú getir notað sömu eða svipuð nöfn. Myndauðkenni ættu ekki að hafa bil eða sértákn.

3Veldu Glugga→ Hegðun.

Atferlisspjaldið opnast. Þú getur dregið Hegðunarspjaldið annað á síðunni og þú getur stækkað það með því að draga botninn eða hliðina. Þú gætir líka viljað loka öllum öðrum opnum spjöldum til að skapa meira pláss með því að smella á dökkgráa stikuna efst á hvaða spjaldi sem er.

4Veldu mynd.

Veldu myndina á síðunni sem mun þjóna sem kveikja að aðgerðinni.

5Veldu hegðun Skipta um mynd.

Þegar kveikjumyndin er valin á vinnusvæðinu, smelltu á plústáknið á hegðunarspjaldinu til að opna fellilistann yfir aðgerðir og veldu aðgerðina sem þú vilt beita.

6Tilgreindu myndirnar sem á að skipta um í glugganum Skipta um mynd.

Í Myndir listanum skaltu velja auðkenni myndarinnar sem verður skipt út. Smelltu á Browse hnappinn til að velja myndina sem kemur í stað aðalmyndarinnar. Ef myndin er ekki þegar vistuð í möppunni á staðnum mun Dreamweaver bjóða upp á að afrita hana þangað fyrir þig.

7Neðst í Skiptu um mynd valmynd, veldu Forhlaða myndum valkostinn til að gefa vafranum fyrirmæli um að hlaða öllum myndum inn í skyndiminni þegar síðan er hlaðið.

Ef þú velur ekki þennan valkost getur tafið orðið þegar myndaskiptin eru notuð.

8Ef þú vilt skaltu afvelja Restore Images OnMouseOut valkostinn.

Valkosturinn Restore Images OnMouseOut þýðir að þegar atburði er lokið (svo sem þegar músin er færð af smámyndinni sem kveikir) er upprunalegu myndinni skipt út. Sjálfgefið er að Dreamweaver forvelur þennan valkost fyrir hegðun Skipta um mynd. Þú gætir viljað afvelja þennan valkost ef þú kemst að því að það að skipta út upprunalegu myndinni í hvert skipti sem þú veltir bendilinn yfir aðra smámynd er truflandi.

9Eftir að þú hefur tilgreint allar stillingar fyrir hegðunina skaltu smella á OK.

Nýja hegðunin birtist á Hegðuspjaldinu.

10Tilgreindu atburð fyrir hegðunina.

Eftir að aðgerðinni hefur verið beitt geturðu farið til baka og tilgreint hvaða atburður mun kalla aðgerðina af stað. Sjálfgefið er að Dreamweaver beitir OnMouseOver-tilvikinu þegar þú notar aðgerðina Skipta um mynd, en þú getur breytt því tilviki í hvaða sem er tiltækt, eins og OnClick, sem krefst þess að notandinn smelli á myndina til að kveikja á Skiptu um mynd.

11Beitaðu viðbótarhegðun.

Til að beita Skipta mynd hegðun á aðrar myndir á síðu, endurtaktu skref 5–10, smelltu til að velja myndina sem þú vilt virka sem kveikju og tilgreinir síðan samsvarandi mynd sem ætti að skipta um.

12Prófaðu vinnu þína í vafra.

Þú getur ekki séð áhrif hegðunar eins og þessarar fyrr en þú smellir á Live view hnappinn efst til vinstri á vinnusvæðinu í Dreamweaver eða forskoðar síðuna þína í vafra.