Question

我们有一个滑块，我们想要使用。死的简单的东西。但我需要它变得更有活力。

我们有一个博客卷，它在php循环上运行并显示，基本上......如果我们将循环设置为6 ..它会生成6组div。

现在我的想法是，将显示博客文章的DIV放在滑块中，然后我们可以显示随后的帖子，因为每个div都会刷新..有点儿......我相信你知道我的意思。

我做了一个简单的小提琴...... http://jsfiddle.net/ozzy/yEB4V/

基本上，我们只需要一个<li> to </li>

原因是，我们可以在LI标签周围设置php，以便循环工作，并且幻灯片会相应更新。

我遇到的问题是，第一次触发LI时，由于显而易见的原因，它必须没有display：none ..所有后续出现的LI标签都会被隐藏。< / p>

从小提琴中可以看出，除了第一个LI标签之外，所有LI标签都没有显示，因此它首先显示，然后循环显示到下一个，每个标签都会更新。

脚本在这里;

var slider = function() {
    $('#testimonials .slide').filter(':visible').fadeOut(1000,function(){
        if($(this).next('li.slide').size()){
            $(this).next().fadeIn(2000);
        }
        else{
            $('#testimonials .slide').eq(0).fadeIn(1000);
        }
    });
};
var interval = setInterval(slider, 2000);
$('#testimonials .slide').hover(function() {
    clearInterval(interval);
}, function() {
    interval = setInterval(slider, 2000);
});

我想知道是否有人知道如何绕过这个...因为我们的PHP代码将是这样的：

<ul id="testimonials">
 <!-- OUR PHP LOOP-->
   <li class="slide">
    <div>
        <h1><?php echo $title; ?></h1>
        <p><?php echo $stuff; ?>
    </div>
    </li>
  <!-- // PHP LOOP -->
</ul>

Answer 1

您可以使用jquery使第一个孩子可见。

$(document).ready(function(){
    $('#testimonials :first-child.slide').show(0);
    //.. rest of the stuff
});

在php中，将所有div设置为display：none

Answer 2

使用：

    <ul id="testimonials">
<?php foreach($lis as $li) { ?>
       <li class="slide"<?php if($li == $lis[0]) echo ' style="display:list-item;"' ?>>
        <div>
            <h1><?php echo $title; ?></h1>
            <p><?php echo $stuff; ?>
        </div>
        </li>
<?php } ?>
    </ul>

将display：none附加到后续的循环中

2 个答案: