我在Wordpress中通过php jQuery进行了幻灯片演示它基本上是这样的:在帖子中我用自己的名字“sliderPhotoImg1”,“sliderPhotoImg2”等自定义字段,通过php获取自定义字段中的所有照片并放入其中
在此之后我通过jQuery进行幻灯片放映,这很简单,它仅适用于一个帖子,但如果我在每个帖子中都有幻灯片放映,则不适用于每个div $(“#Slider-”)但img的索引应该是显示从帖子到帖子的跳转。
您可以在www.acroart.pl找到问题
<div id="Slider-<?php the_ID(); ?>">
<?php
$dot = (int)get_post_meta($post->ID, "dots", true);
for($i = 0; $i< $dot; $i++){
if($i <= $dot){
echo '<div><img src="';
echo get_post_meta($post->ID, "sliderPhotoImg".($i+1), true);
echo '"></div>';
}
}
?>
</div>
<script>
$( "#Slider-<?php the_ID();?> > div:gt(0)" ).hide();
setInterval( function () {
$( "#Slider-<?php the_ID();?> > div:first" )
.fadeOut( 1000 )
.next()
.fadeIn( 1000 )
.end()
.appendTo( "#Slider-<?php the_ID();?>");
}, 3000 );
$("#Slider-<?php the_ID();?> > div > img").css({
"position": "relative",
"width": "600px",
"height": "400px"
});
</script>
我在jquery里面的php代码中添加了echo,试试这个并告诉我们
<div id="Slider-<?php the_ID(); ?>">
<?php
$dot = (int)get_post_meta($post->ID, "dots", true);
for($i = 0; $i< $dot; $i++){
if($i <= $dot){
echo '<div><img src="';
echo get_post_meta($post->ID, "sliderPhotoImg".($i+1), true);
echo '"></div>';
}
}
?>
</div>
<script>
$( "#Slider-<?php echo the_ID();?> > div:gt(0)" ).hide();
setInterval( function () {
$( "#Slider-<?php echo the_ID();?> > div:first" )
.fadeOut( 1000 )
.next()
.fadeIn( 1000 )
.end()
.appendTo( "#Slider-<?php the_ID();?>");
}, 3000 );
$("#Slider-<?php the_ID();?> > div > img").css({
"position": "relative",
"width": "600px",
"height": "400px"
});
</script>