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>