Archief - CSS: mouseover borders

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
P

Politik

Legacy Member
Kort en simpel: ik heb een kader en wil dat de kleur van de border verandert als ik mijn muis erover beweeg. Het is een kader met tekst in en néén, het kader linken is geen optie. Bovendien moeten zowel Firefox als IE dit ondersteunen. Hoe doe ik dit?
C

Cakeman

Legacy Member
In de veronderstelling dat je kader een div is:
Code: 
<div onmouseover="this.style.borderColor='#660000'" onmouseout="this.style.borderColor='#000066'">Tekst</div>

Edit: je kan ook gewoon je div een andere css-klasse geven:
Code: 
<div onmouseover="this.className='metRand'" onmouseout="this.className='zonderRand'">Tekst</div>
T

Tsjernobyl

Legacy Member
Voor zoiets zou ik zeker geen javascript gebruiken.

Doe het best zoals cakeman zegt.
O

Obliv`

Legacy Member
Tsjernobyl zei:
Voor zoiets zou ik zeker geen javascript gebruiken.

Doe het best zoals cakeman zegt.
Klik om te vergroten...

De oplossing van cakeman maakt toch gebruikt van javascript? :)

Om dit in zowel IE als Firefox te laten werken moet je javascript gebruiken, aangezien IE alleen hovers op a-elementen kent.
J

Jellepunk

Legacy Member
Tsjernobyl zei:
Voor zoiets zou ik zeker geen javascript gebruiken.

Doe het best zoals cakeman zegt.
Klik om te vergroten...

die andere klasse toewijzen is volgens mij ook JS.
N

NeoNeke

Legacy Member
en cakeman gebruikt geen javascript of wat?

man dees is een moeilijke:

HTML: 
<div id="john">do</div>

css:
HTML: 
#john {
	border: 1px #ff3333 solid;
}
#john:hover {
	border: 1px #229944 solid;
}

kan ook met class selectors
J

Jellepunk

Legacy Member
NeoNeke zei:
en cakeman gebruikt geen javascript of wat?

man dees is een moeilijke:

HTML: 
<div id="john">do</div>
css:
HTML: 
#john {
    border: 1px #ff3333 solid;
}
#john:hover {
    border: 1px #229944 solid;
}
kan ook met class selectors
Klik om te vergroten...

nja, die js is natuurlijk voor ie6 dan hé.
met de klasses werken is simpelste en overzichtelijkste. maar zonder DOM kan je dit niet doen werken in ie6...
T

Tsjernobyl

Legacy Member
Ik heb de vraag helemaal verkeerd gelezen. Ik dacht dat je wel mocht linken. My bad.

Het komt er dus op neer dat ik niets nuttigs heb te zeggen.
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan