Sziasztok!
Olyat szeretnék csinálni, hogy van 4-5 szöveg és egy kép az oldalon, és amikor az egyes szövegek fölé megyek az egérrel, akkor kicseréli a képet egy másikra.
Tud valaki erre valami egyszerű kódot mutatni?
Köszi.
Sziasztok!
Olyat szeretnék csinálni, hogy van 4-5 szöveg és egy kép az oldalon, és amikor az egyes szövegek fölé megyek az egérrel, akkor kicseréli a képet egy másikra.
Tud valaki erre valami egyszerű kódot mutatni?
Köszi.
Ez nagyon egyszerű:
Az img tagnél az id megadása a lényeg és hogy az a tagnél erre hivatkozz.Kód:<img src="alapkép elérésnek címe" id="pic" /> <a href="#" onmouseover="document.getElementById('pic').src='új kép elérésének címe';return false;">új kép 1</a> <a href="#" onmouseover="document.getElementById('pic').src='egy következő kép elérésének címe';return false;">új kép 2</a>
Vagy esetleg ha nincsen kedved a JS-hez akkor css-el;
Kód:#kep{background:url('./')} #kep:hover{background:url('./')}
Utoljára módosítva: hápi által : 2009-05-04 11:28
Köszi srácok.
Ez tényleg egyszerű.
Ha nagy képről van szó, akkor érdemes a következő két csel valamelyikéhez folyamodnod:
1. JavaScript-es megvalósítás esetén pre-loadold a felbukkanó képet.
2. CSS esetén pedig mentsd el egy képbe a kettőt, és csak mozgasd el függőleges irányban Y pixelnyit a background-position-el.
Szerintem fölösleges ide JavaScript, használj inkább stíluslapot!
CSS:
HTML:Kód:#kepcsere { background-image: url(./a_kep_eleresi_utja/fajl_neve.jpg); display: block; width: 640px; /* A kép szélessége pixelben. */ height: 480px; /* A kép magassága pixelben. */ } #kepcsere:hover { background-position: 0px -480px; /* Az első az X a második az Y koordináta. */ }
Kód:<div id="kepcsere"></div>
És ez úgy is használható, ha több képet kell cserélgetni?
Esetemben 5-6 név van, és mindegyik névhez más fénykép és térképfedvény tartozik.
Az egyes nevek főlé érve kell váltakoznia az adott cellában a képnek.
Tényleg műxik!
Nem tudom, hogy eddig mit bénáztam.
Köszi.
Könyvjelzők