0

Hi All,

I'm trying to put together a "fade in", "fade out" segment for user comments on a website. The array of comments with key=>value (memberName=>comment) comes from php. I'm looping through using jQuery like so;

$(document).ready(function(){

        function swap() {
            <?php foreach ($memberTestimonials as $member=>$testimonial) : ?>
                $('#testimonialMessage').fadeIn(5000);
                $('#testimonialMessage').html("<p><?php echo $testimonial; ?></p>");
                $('#testimonialMessage').fadeOut(5000);
            <?php endforeach; ?>
            swap();
        }

        swap();
    }); 

The array $memberTestimonials is;

array (size=3)
'Michael Burrells' => string 'This was a lot of fun!' (length=22)
'Homer Simpson' => string 'Mmmmmm. Donuts.' (length=15)
'Albert Einstein' => string 'E=MC^2' (length=6)

The only issue is, only the E=MC^2 record is showing (repeatedly). It shows three times without recursion.

Does anyone have any ideas why this might be happening?

Thanks for any help offered.

4
Contributors
8
Replies
25
Views
3 Years
Discussion Span
Last Post by Tinnin
0

Try this:

<?php foreach ($memberTestimonials as $member=>$testimonial) { ?>
    $('#testimonialMessage').fadeIn(5000);
    $('#testimonialMessage').html("<p><?php echo $testimonial; ?></p>");
    $('#testimonialMessage').fadeOut(5000);
<?php } ?>
0

I'm guessing it has to do with the array_pointer keep in mind they don't recommend reset on associative arrays, but it might give you an idea.

Edit
Take a peek at the resulting jQuery function to see if the problem comes from PhP or if it's jQuery we have to adress.

Edited by Fernando_4

0

This is the output from source:

<script type="text/javascript">
    $(document).ready(function(){

        function swap() {
                            $('#testimonialMessage').fadeIn(5000);
                $('#testimonialMessage').html("<p>This was a lot of fun!</p>");
                $('#testimonialMessage').fadeOut(5000);
                            $('#testimonialMessage').fadeIn(5000);
                $('#testimonialMessage').html("<p>Mmmmmm. Donuts.</p>");
                $('#testimonialMessage').fadeOut(5000);
                            $('#testimonialMessage').fadeIn(5000);
                $('#testimonialMessage').html("<p>E=MC^2</p>");
                $('#testimonialMessage').fadeOut(5000);
                        swap();
        }

        swap();
    }); 
</script>
0

Here's what I think is happening. Tell me if this sounds stupid.

The .html() call is being looped through to the end before the first .fadeIn() has even finished. The other calls to fade then follow.

Which means that I would have to delay the calls to .html()....

That's all I can come up with, as ridiculous as it sounds to me.

0

Or I suppose it could be that the php is happening server-side and hitting the end of the array before the javascript has even begun.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.