Ik ben totaal niet thuis in jQuery maar probeer een image fade te maken voor een website. De bedoeling is dat bij een mouseover de oppacity fade naar 0.3. Maar dat de span die ik er in heb gezet infade bij de mouse-over. Ik heb op dit moment het volgende:
<script type="text/javascript">
$(function() {
$('.cover').each(function() {
$(this).hover(
function() {
$(this).stop().animate({ opacity: 0.3 }, 400);
},
function() {
$(this).stop().animate({ opacity: 1.0 }, 400);
})
});
});
</script>
Dit is mijn functie om de image zelf te faden. Dit werkt zoals ik wil. Ik weet alleen niet wat ik er bij moet scripten om ook de span in deze animatie in te faden. $(this.span).stop().animatie({ opacity: 1.0}, 400); gokte ik zo met mijn botte programmeer kennis. Maar dat werkt niet.
Mijn HTML ziet er als volgt uit:
<div class="cover" style="padding-right: 65px;">
<a href="#"><img src="images/cover_nowhere.jpg" alt="Vade in tekst - invade " />
<span style="position:absolute;">tekst - tekst</span>
</a>
</div>
Wil me graag meer verdiepen in jQuery maar kom hier even niet uit. Iemand een idee? Voorbeeld is hier te bekijken: Klik.
