Archief - Css : Border rond Pic.

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.
v

verdeye

Legacy Member
Jow,
ik ben op zoek naar de css code,
om een border rond een image te laten verschijnen bij een mouseover.

( Bestaat er ook iets dat wanneer je een image plaats, en deze niet beschikbaar is, (normaal zou hier dan een kruisje komen) waardoor dit kruisje dan weggaat en dus niet verschijnt als de browser de image ook niet kan vinden. )

many thx
L

Lashknife

Legacy Member
zelfde als al die andere onmouseover/out zaken

<img src="blabla.jpg" overige attributen onmouseover="this.style.borderStyle='solid';this.style.borderColor='black';this.style.borderWidth='1px'" onmouseout="same shit, maar met andere values" />

de waarden voor solid, black en 1px kunnen ook opgevuld worden om de top/right/bottom/left (volgorde!!) values te geven

this.style.borderStyle="solid dashed dotted groove"
this.style.borderColor="black red blue yellow"
this.style.borderWidth="1px 2px 3px 4px"
L

Lashknife

Legacy Member
dan gaat ge 2 classes moeten aanmaken die ge in uw css file zet
maar in uw images moet nog steeds dan deze code komen

<img de rest onmouseover="this.className='overclass'" onmouseout='this.className='outclass'" />

uw classes heten dan resp. "overclass" en "outclass"
d

dresse

Legacy Member
tuurlijk is da mogelijk met css :)

Code: 
a:link, a:active, a:visited        {border:0px}
a:hover 		                {border:1px  solid black}
denk dat da moet lukke ^^
misschien nog display:block bij u img zette, ma normaal gezien is een img al een ellement op blokniveau.
in elk geval, ik heb het zo gedaan op men dresign2 bij sketches(zie sig)


en voor tekst te laten verschijnen als een afbeelding ni gevonden wordt moete gewoon u alt="" definieren...
Z

Zero Grav

Legacy Member
Lashknife zei:
zelfde als al die andere onmouseover/out zaken

<img src="blabla.jpg" overige attributen onmouseover="this.style.borderStyle='solid';this.style.borderColor='black';this.style.borderWidth='1px'" onmouseout="same shit, maar met andere values" />

de waarden voor solid, black en 1px kunnen ook opgevuld worden om de top/right/bottom/left (volgorde!!) values te geven

this.style.borderStyle="solid dashed dotted groove"
this.style.borderColor="black red blue yellow"
this.style.borderWidth="1px 2px 3px 4px"
Klik om te vergroten...

teveel overbodige code :p
K

Kn0t

Legacy Member
Als het gewoon een image is (geen link) dan kunt ge het volgens mij niet anders dan met javascript hoor?

img:hover zal niet werken in IE.

in firefox en opera wel denk ik.
d

dresse

Legacy Member
waarom img:hover??
gewoon a:hover gaat toch ook..

<a href=""><img src=""></a>
-> parent tag is <a> dus zal ook de eigenschappen van a krijgen eh...

http://dresse.free.fr/dresign/sketches.html
bij mij werkt het in ie perfect en in firefox half en in opera ook half (zie nu pas dat het in firefox ni optimaal is, waarschijnlijk foutje gemaakt...)
L

Lashknife

Legacy Member
hij vroeg geen a-img-/a eh
hij vroeg een border rond een image..... weet ik veel wat hij van plan is, ik creëer daarom niet overal de nodige <a>'s rond ze
En als ge slechts bepaalde images een border wilt geven met alle nodige features, dunno hoe overbodig dat dan is?

Zero Grav zei:
teveel overbodige code :p
Klik om te vergroten...
show me :p want een class maken voor slechts 1 img een border te geven is evengoed een aantal extra stukjes code

en kgeloof dat pseudo classes buiten a: nog in hun kinderschoenen staan qua ondersteuning
d

dresse

Legacy Member
Lashknife zei:
hij vroeg geen a-img-/a eh
hij vroeg een border rond een image..... weet ik veel wat hij van plan is, ik creëer daarom niet overal de nodige <a>'s rond ze
En als ge slechts bepaalde images een border wilt geven met alle nodige features, dunno hoe overbodig dat dan is?


show me :p
Klik om te vergroten...

ehm, hij vroeg gewoon een border rond een image als hij er met de muist overgaat en ik zeg dat ge een border rond een image kunt verkrijgen door daar een link van te maken...
ge moet daarvoor geen src gaan zetten eh.

zo werkt het en zo is de enige simpele manier. en u code is overbodig want met die van mij gaat het makkelijker ! :)

i have spoken
d

dresse

Legacy Member
Lashknife zei:
extra html vs extra css, kiest ge zelf
Klik om te vergroten...

buh, voor zover da ik iets van javascript ken is da van u toch ni echt html peisk. en bij mijn oplossing moete toch ni echt veel css schrijve :)

enifn, threadstarter heeft nu verschillende oplossingen :) tzal wel lukke :)
L

Lashknife

Legacy Member
dresse zei:
buh, voor zover da ik iets van javascript ken is da van u toch ni echt html peisk. en bij mijn oplossing moete toch ni echt veel css schrijve :)
Klik om te vergroten...
err, hij vroeg om een css oplossing en gij geeft een html (keur het niet af eh)
enfin, threadstarter heeft nu verschillende oplossingen :) tzal wel lukke :)
Klik om te vergroten...
:confused: :wtf: err, uw <a> errond = html
mijn onmouseover met dhtml zijn meer css related dan uw toegevoegde <a> :unsure:

alle soit, hij kan idd kiezen :woohoo: weer ne gelukkige coder erbij
d

dresse

Legacy Member
Lashknife zei:
:confused: :wtf: err, uw <a> errond = html
mijn onmouseover met dhtml zijn meer css related dan uw toegevoegde <a> :unsure: alle soit, hij kan idd kiezen
Klik om te vergroten...

html VS css, dacht dus da ge het over u html tegenover mijn css had...

enfin :offtopic: :)
B

BART_SIMPSON416

Legacy Member
Is waarschijnlijk niet echt correct html maar hier is iets dat werkt:
<img scr="1.jpg" onmouseover="border=1" onmouseout="border=0"></img>

Hoe ik hier ben opgekomen.
Geen idee.
Z

Zero Grav

Legacy Member
BART_SIMPSON416 zei:
Is waarschijnlijk niet echt correct html maar hier is iets dat werkt:
<img scr="1.jpg" onmouseover="border=1" onmouseout="border=0"></img>

Hoe ik hier ben opgekomen.
Geen idee.
Klik om te vergroten...

:lol: nice going
Z

Zero Grav

Legacy Member
ik heb het wel getest maar daar draait het ni echt om. De code is nooit valid en werkt nooit op alle browsers. Ge moet mensen ni opt verkeerde spoor zetten omda gij ff een geniale :ironic: ingeving had
L

LunchBox

Legacy Member
kunt een kapotte vaas ook plakken met tuttefrut maar dat maakt het dus nog geen goede oplossing. misschien eerst eens html bekijken he bartsimpson tis zo'n beetje als secondenlijm, tmacheert en ge zit ni met overbodige rotzooi.

scr ipv src, <img></img> ipv <img />, = binnen een (non-href) html attribuut :wtf:
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