jQuery Cycle Plugin - 使用php_poscer循环使用php query_posts和显示标题的图像

时间:2011-06-23 15:35:55

标签: jquery jquery-cycle

我怎样才能正确显示每个循环图像的对应字幕?

PHP:

<div id="cycle-gallery">
<?php query_posts("cat=38&showposts=2");  ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
img src="/<?php echo get_post_meta($post->ID, 'Image', true); ?>" alt="Icon for Post     #<?php the_ID(); ?>" </a>
<?php endwhile; ?></div>
<div id="cycle-caption"><?php the_excerpt(); ?></div>
<div id="cycle-nav"></div>

jQuery的:

jQuery(document).ready(function(){
jQuery('#cycle-gallery').cycle({
fx: 'fade',
speed: 'slow',
timeout: 7000,
next: '#nextimg',   
pager: '#cycle-nav',
prevNextClick: function(isNext, zeroBasedSlideIndex, slideElement) {
        $('#cycle-caption').fadeOut().eq(zeroBasedSlideIndex).fadeIn(200);
    },
    pagerClick: function(zeroBasedSlideIndex, slideElement) {
        $('#cycle-caption').fadeOut().eq(zeroBasedSlideIndex).fadeIn(200);
    }   
});

});

1 个答案:

答案 0 :(得分:0)

这就是我的样子:

循环循环cycle-gallery元素。这意味着嵌套在里面的每个元素都将循环使用。

尝试类似

的内容
<div id="cycle-gallery">
  <div class="cycle-item">    
    <?php query_posts("cat=38&showposts=2");  ?>
    <?php while (have_posts()) : the_post(); ?>
    <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><img src="<?php echo get_post_meta($post->ID, 'Image', true); ?>" alt="Icon for Post #<?php the_ID(); ?>" /></a>
    <div id="cycle-caption"><?php the_excerpt(); ?></div>
    <?php endwhile; ?>
    <!-- <div id="cycle-nav"></div> -->
  </div> <!-- close cycle-item -->
</div> <!-- close gallery -->