login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Fade afbeelding

Offline Frederic - 09/09/2005 20:07 (laatste wijziging 09/09/2005 20:13)
Avatar van FredericPHP ver gevorderde Kan iemand me vertellen waarom volgend stukje niet werkt:
in het CSS document staat
  1. img.afbeelding-zacht {
  2. opacity: .5;
  3. }
  4.  
  5. img.afbeelding-zacht a:hover {
  6. opacity: .9;
  7. }

en in de broncode
  1. <a onclick="window.open(this.href,'_blank');return false;" href="http://validator.w3.org/check?uri=referer"><img class="afbeelding-zacht" src="afbeeldingen/klein/W3C-XHTML.png" alt="W3C XHTML 1.0 Strict!" title="W3C XHTML 1.0 Strict!" /></a>

De afbeelding is wel 'zacht', maar bij het overgaan met de muis wil ik dat de originele kleuren terug komen (opacity: .9;), maar dat gebeurt vreemd genoeg niet!

Thanks!

16 antwoorden

Gesponsorde links
Offline Ultimatum - 09/09/2005 20:09
Avatar van Ultimatum PHP expert <div class="afbeelding-zacht"><img src="afbeelding.gif"></div>

mss dat dat helpt al betwijfel ik he zelf 
Offline Ontani - 09/09/2005 20:11
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
lijkt me omdat er geen link rond staat
je doet a:hover dus zal er ook een <a></a> tag rond moeten
Offline Frederic - 09/09/2005 20:13
Avatar van Frederic PHP ver gevorderde Correctie:
dit is de juiste IMG tag:
  1. <a onclick="window.open(this.href,'_blank');return false;" href="http://validator.w3.org/check?uri=referer"><img class="afbeelding-zacht" src="afbeeldingen/klein/W3C-XHTML.png" alt="W3C XHTML 1.0 Strict!" title="W3C XHTML 1.0 Strict!" /></a>

had de <a> tag er niet bijgenomen omdat ik dacht dat het niet nodig was.
Offline Ontani - 09/09/2005 20:18
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
getest in IE of FF?
Offline Frederic - 09/09/2005 20:22 (laatste wijziging 09/09/2005 20:23)
Avatar van Frederic PHP ver gevorderde In IE: de afbeeldingen vervagen niet in gewone toestand (en dus in Hover kan ik niet weten of die terug in normale stand komen)
In FF: de afbeeldingen vervagen (maar de hover komt niet tot zijn recht)
Offline Rens - 09/09/2005 20:25
Avatar van Rens Gouden medaille

Crew algemeen
a:hover is alleen voor links dacht ik.
probeer het zo eens:

  1. img.afbeelding-zacht:hover {
  2. opacity: .9;
  3. }
Offline Ontani - 09/09/2005 20:25 (laatste wijziging 09/09/2005 20:26)
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
  1. img.afbeelding-zacht {
  2. opacity: .5;
  3. filter: alpha(opacity=50);
  4. }
  5.  
  6. img.afbeelding-zacht a:hover {
  7. opacity: .9;
  8. filter: alpha(opacity=90);
  9. }
Offline Frederic - 09/09/2005 20:29
Avatar van Frederic PHP ver gevorderde Rensjuh zijn oplossing werkt in FF, maar IE & Opera passen het effect niet toe.
Dankzij de extra regel van Ontani vervaagt de afbeelding in IE (NIET in Opera, daar blijven de gewone kleuren), maar IE snapt de hover dan weer niet denk ik..
Offline Ontani - 09/09/2005 20:38
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
Opera heeft geen ondersteuning voor oppacity dus daar zou ik m'n tijd al niet insteken om daar iets op te gaan verzinnen
Offline Frederic - 09/09/2005 20:41
Avatar van Frederic PHP ver gevorderde Dan maar laten zoals het is Thanks voor de medewerking!
Offline Rens - 09/09/2005 20:44 (laatste wijziging 09/09/2005 20:44)
Avatar van Rens Gouden medaille

Crew algemeen
Je zou misschien een plaatje kunnen maken met de opacity op 9 (dacht ik) en dan een background-image instellen bij de hover, dan krijg je een ander plaatje te zien.

Hetzelfde dus als een mouseover, maar dan gewoon een ander plaatje laten zien.
Offline Frederic - 09/09/2005 20:46
Avatar van Frederic PHP ver gevorderde Ah, maar ik had gekozen voor de opacity omdat 2x afbeeldingen weer het dubbel is van wat geladen moet worden (en dan heb je bij de onmouseover eventjes een delay van het laden van de image)...
Offline Rens - 09/09/2005 20:47
Avatar van Rens Gouden medaille

Crew algemeen
Jah, dat dan weer wel.
Maar je hebt wel wat je eerst wilde bereiken^^
Offline Ontani - 09/09/2005 20:48
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
http://www.site...amp;id=273

hadden we daar al gekeken?
Offline Frederic - 09/09/2005 20:58
Avatar van Frederic PHP ver gevorderde Ontani, u bent geweldig 
Offline Ontani - 09/09/2005 23:33
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1
zo hoor ik het graag , volgende keer zelf effe check op de site
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.215s