如何在wordpress中修复照片更改幻灯片?

问题描述 投票:0回答:1

我在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>
javascript php jquery
1个回答
0
投票

我在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>
© www.soinside.com 2019 - 2024. All rights reserved.