Mouseover plaatje met css
Een plaatje op laten lichten d.m.v. een mouseover kun je maken door een paar regeltjes toe te voegen aan de code van je plaatje. In de CSS zet je de opacity ervan. Het voordeel van deze methode t.o.v. een mouseover met javascript is dat je maar 1 plaatje nodig hebt en dus niet allemaal donkere plaatjes hoeft te gaan zitten maken.
Wat je doet is de volgende regel in je CSS file zetten:
.opa{
opacity:0.6;
filter:alpha(opacity=60);
}
opacity:0.6;
filter:alpha(opacity=60);
}
En je HTML image tag kom er dan zo uit te zien:
<img class="opa" src="images/plaatje.jpg" alt="plaatje" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=60" />
Een voorbeeldje hiervan staat op de zoekmachines pagina, de helderheid van de vlaggetjes gaat van 60 naar 100% bij een mouseover.
10.05.2010. 00:25
Reacties
Artikel is nog niet van reacties voorzien.
Menu / Categorieën
- Home
- snews installeren snews cms
- Links
- Windows XP
- Windows 7
- Firefox
- html-css
- layout met css
- CSS Menu
- css3 ronde hoeken
- flash player op website
- list-style-type
- Accordeon menu css
- Vaste Toolbar
- Html Video Tutotrial
- mouseover plaatje
- Kleurverschil in website
- Css menuknoppen maken
- Hover menuknop laden
- Mouseover terug knop
- Apache en php
- HTML en CSS Code Snippets
- Foto gallery voor je site
- Html speciale tekens
- formulieren stylen
- Plaatje binnen div
- Volledige pad public-html
- Eigen Website Maken
- Hoe van frames naar css?
- Website Plaatjes
- Gratis programma's
- Overige Tips
- Internet ergernissen top 20
- Is dit spam?
- Seo Tips
- Andere Praatjes
- Voorwaarden
- Link Generator
- Html Converteren
- Font Tester
Tools
Laatste Reacties
Schrijf reactie
* = Verplicht veld