Sziasztok,
általában minden felmerülő css problémámat megoldom, de most valami kifogott rajtam. Valószínűleg csak túl későre jár, de nem tudom, hogy mi okozza a hibát, és leblokkoltam :/
Akkor kezdem.
Adott a layout: van egy fix méretű div, annak van egy fix méretű háttérképe. A háttérképre rajzoltam egy imagemap-et, ezt a div és a háttérkép méretével megegyező átlátszó képen használom. Az átlátszó kép position: absolute.
Készítettem külön hover kép szeleteket, amelyek látszólag az imagemap egy-egy aktív területét hivatottak leváltani, de a cserélendő terület nagyobb, mint az map area. A hover képek fix koordinátákon kell, hogy legyenek. A lényeg, hogy az átlátszó kép (az imagemap-pal) nagyobb z-indexű, mint a betöltendő hover képek, azaz az átlátszó kép alá, de még a háttérkép fölé tölteném be a hovereket. A hoverek display tulajdonságát egy végtelenül egyszerű DOM javascript kapcsolgatóval állítom.
Lehet, hogy nagyon bonyolultul hangzik, de lecsupaszítottam egy példa kódot.
hxxp://m42.hu/temp/css
a fájlok:
index.html
styles/page2.css
scripts/toggle.js
Ha valaki meg tudná nekem mondani, hogy miért nem megy IE6 alatt, és miért megy tökéletesen Firefox, Opera és Safari alatt, azt nagyon megköszönném.
Lehet, hogy a koncepcióm hibás, de nem szeretnék css-ben clip-et alkalmazni, valahogy ezt szeretném megoldani.
Annyit kérnék még, hogy ha nincs ötleted, akkor ne írd be, hogy nincs, és ha csupa irreleváns mondandód van, akkor se írj, engem most kizárólag a megoldás, és a probléma forrása érdekelne.
Nagyon köszönöm mindenkinek.