...

View Full Version : jQuery Fading a Changing DIV



Sloth Script
01-25-2011, 01:43 AM
Currently I am creating a script, that will cycle through an array of testimonials, display each one for 15 seconds, and then moving on to the next one.

I have this working properly. I would like to add a fade in / out for every testimonial, however, I have not succeeded at doing that.
Using the fadeIn / fadeOut jQuery functions, I can fade the first testimonial in and out without any problems; however, the second one never fades in.

I have tried using functions written online, with the same result.

Any help is appreciated, as I am only just starting to learn JavaScript / jQuery.

(Here is my code, with all fades removed):



<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type='text/javascript'>

$(document).ready(function() {
var testimony = new Array("It's amazing!", "It's so amazing!", "It's more amazing!", "It's the most amazing!");
var count = testimony.length;
var number = Math.floor(Math.random()*count);

function countdown() {
setTimeout(countdown, 15000);
$('#header').html(testimony[number]);
number = Math.floor(Math.random()*count);
}
countdown();
});

</script>
</head>
<body>
<div id='header'></div>
</body>
</html>

ShaneC
01-25-2011, 01:50 AM
Well it's hard to bug test your problem when the problem has been removed :p.

From looking at it the following should work. If it doesn't work it would be helpful to know if you're getting any Javascript errors (either from FireBug or Chrome's Inspect Element Error Console).



function countdown() {
setTimeout(countdown, 15000);
$('#header').fadeOut( 'slow', function() {
$('#header').html(testimony[number]);
$('#header').fadeIn( 'slow' );
});
number = Math.floor(Math.random()*count);
}

Sloth Script
01-25-2011, 01:56 AM
Thank you!

That fixed the problem;
Originally I had been fading seperate from my actual function, and that was why it was not working (or so I figure!)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum