使用jquery轮播和wordpress,它只显示第一张图像,不显示其他图像
我在 WordPress 主题中使用这个 jQuery Carousel 来显示几个横幅图像。我选择这个脚本是因为我不是一个扎实的 js 编码器,并且需要自动实例化的分页。您可以在 http://bfc.ravennainteractive.com 上查看此问题的示例。它显示第一张图像。有三个可用图像,它列出了 3 个分页项,但图像 2 和 3 仅显示黑色背景。
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>
如果您查看源代码并单击图像,它们就在那里,网址很好。这是愚蠢的事吗?
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?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
感谢您的评论。对于这个特定的轮播,.hero 类位于包含的 div 上。然而我终于发现我的问题是基于CSS的。我没有将 li 设置为 display:inline。
非常感谢
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