Ik hoopte dat iemand me kon helpen met een jQuery-vraag. Ik heb
een site waar ik tekstblokken wil laten kleuren veranderen binnen
gedefinieerde tijdsintervallen wanneer de pagina wordt geladen. Als
voorbeeld in de volgende code;
<div id="fade">
<div class="fade1">text block 1</div>
<div class="fade2">text block 2</div>
<div class="fade3">text block 3</div>
</div>
Ik zou .fade1 willen veranderen van kleur: # 000, font-weight:
normaal; kleuren: # F00, lettertype-gewicht: vijf seconden
vetgedrukt en dan weer normaal; gevolgd door .fade2 en vervolgens
.fade3 enz. Ik wil dat deze effecten optreden bij het laden van de
pagina en niet worden geactiveerd door muisklik of zweven.
Ik ben redelijk nieuw in dit type programmeren en heb geprobeerd
om met de methoden jQuery.Color() en .anim() te spelen, maar ik kan
niet het gewenste effect bereiken. Alle hulp wordt zeer op prijs
gesteld - dank u.
** Dit is de code die ik heb gebruikt sinds ik dit bericht
schreef:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<div id="fade1">Text Block 1</div>
<div id="fade2">Text Block 2</div>
<div id="fade3">Text Block 3</div>
<script type="text/javascript">
var index = 0;
setInterval(highlightText, 3000);
function highlightText() {
index = (index % 3) + 1;
$('#fade' + index).css('color', '#e7008a').css('font-size', '110%');
setTimeout(function() {
$('#fade' + index).css('color', '#000').css('font-size', '100%');
}, 2900);
}
</script>