Mouseover knoppen maken

Status
Niet open voor verdere reacties.

BartJanssen

Gebruiker
Lid geworden
11 dec 2011
Berichten
106
hoe maak ik een grijze knop die rood word als ik mijn muis erop houd met zwarte letters
kan dit met html
 
sorry maar ik kom er niet achter waar ik hem neer moet zetten in mijn bron kan je dat mij verklappen :P
 
Uhm waar je wilt :) het is gewoon een image bijvoorbeeld:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<img src="Diablo.jpg" onmouseover="this.src='thumbbig-119751.jpg'" onmouseout="this.src='Diablo.jpg'" />
</body>
</html>

Dit zal het plaatje Diablo.jpg laten zien. Als je jouw mouse er op beweegt dan kom dat thumbig plaatje. Haal je er weer vanaf dan wordt het weer diablo

Img src = Base plaatje
Onmouseover = plaatje als je jouw mouse erop houd
Onmouseout = plaatje als je jouw mouse eraf haalt.

Beetje in haast getypt hoop dat het duidelijk is en lichtelijk normaal nederlands :)

gr MouNt
 
Hoi Bart,
Javascript gebruiken voor een mouse-over hoeft niet. Je kunt ook alleen css gebruiken: een css-hover. Daarmee blijft de html mooi schoon, het werkt ook als javascript uit mocht staan, en je kunt toe met 1 afbeelding (de twee gecombineerd), wat minder downloadtijd vraagt. Ook hoeft de hover-afbeelding niet ge-preload te worden, want het is er meteen al bij de vertoning van de normale toestand.
Het werkt met de background-position.



Met vriendelijke groet,
CSShunter
 
Hoi Bart,
Nog een nagekomen bericht!

Hierboven is steeds uitgegaan van een knop als afbeelding, die dan bij een hover verwisseld moet worden.

Maar het kan ook zonder afbeeldingen, met een tekst-link die als knop opgemaakt is met css.
Dan heb je dus alleen html en css nodig.



Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan