Toon posts:

CSS mouse over afbeelding ergens anders veranderen

Pagina: 1
Acties:

Verwijderd

Topicstarter
Ik heb een achtergrond afbeelding (opgemaakte tekst) waar ik op diverse plekken een transparante afbeelding overheen zet die als mouse over moet gaan dienen.

Hierbij de vraag:
In onderstaande code staat op regel 4 een afbeelding die als mouse over moet gaan werken.
Wat ik wil is wanneer je met je muis over het plaatje gaat er een afbeelding verschijnt op de plaats in regel 6 in de code.
Er komen zo 18 mouse overs door de hele site heen die allemaal het beeld op regel 6 in de code moeten gaan veranderen. Als je met je muis vertrekt (mouse out) moet het plaatje weer verdwijnen, zodat de oorspronkelijk opmaak weer zichtbaar is.
Hoe kan ik dat het beste doen, met een JS script of is er een mooie CSS oplossing voor?
Ik heb gezocht en vind van allerlei js scripts die ik niet kan/wil gebruiken, een css oplossing heb ik niet kunnen vinden.
code:
1
2
3
4
5
6
7
8
9
<body>
<div style="position:relative;width:447px;height:288px;background-image:url(pics1/text-page.gif);-adbe-g:p,2,2;">
<div style="position:absolute;top:2px;left:23px;width:77px;height:10px;">
<a href="#">[img]"pics1/but.gif"[/img]</a></div>
<div style="position:absolute;top:130px;left:112px;width:334px;height:156px;">
[img]"pics1/text-page_03.gif"[/img]</div>
</div>
<p></p>
</body>

  • Willem
  • Registratie: Februari 2001
  • Laatst online: 00:08
Ik denk dat je niet uitkomt onder een javascript+css oplossing. Waarom zou je het met alleen (?) CSS willen doen dan? En wat heb je precies al geprobeerd dan? :)

Motor onderhoud bijhouden


  • dominic
  • Registratie: Juli 2000
  • Laatst online: 08-02 14:55

dominic

will code for food

Stel in je CSS twee classes samen; eentje van het element zonder afbeelding, eentje van het element mèt afbeelding. Je kunt dan het element alsvolgt definieren:

code:
1
<element class="classnamezonderplaatje" onmouseover="this.oldclass=this.className;this.className='classnamemetplaatje';" onmouseout="this.className=this.oldclass;">


That's it..

[ Voor 12% gewijzigd door dominic op 05-10-2005 12:26 ]

Download my music on SoundCloud