Using jquery carousel and wordpress, it only shows the first image, none of the others

Question

I am using this jQuery Carousel inside a wordpress theme to show several banner images. I chose this script because I am not a solid js coder and needed pagination that is instantiated automatically. you can see an example of this problem at http://bfc.ravennainteractive.com . It shows the first image. There are three available images, it lists 3 pagination items, but images 2 and 3 just show black backgrounds.

jQuery(document).ready(function(){
            jQuery("div.hero").carousel({
                loop: true,
                pagination: true,
                autoSlide: true,
                autoSlideInterval: 5000,
                dispItems: 1

            });
    });
    <div class="hero">
        <ul>
                <?php query_posts('category_name=header');?>
                <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                    <li>
                        <?php $header_image = get_post_meta($post->ID, 'header_image', true); ?>
                        <a href="<?php the_permalink() ?>"><img width="930" height="365" src="<?php echo $header_image; ?>" /></a>
                    </li>
                <?php endwhile; else: ?>
                <?php endif; wp_reset_query(); ?>       
         </ul>
</div>

If you view source, and click the images, they are there, the urls are good. Is this something stupid?

Answer 1

Thanks for the comments. With this specific carousel, the .hero class goes on the containing div. However I finally figured out that my problem was css based. I had not set the li's to display:inline.

thanks so much