0

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

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

现在我的想法是,将显示博客文章的 DIV 放在一个滑块中,然后我们可以在每个 div 刷新时显示后续文章.. 有点事情.. 我相信你知道我的意思。

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

本质上,我们只需要一个<li> to </li>

原因是,我们可以在 LI 标记周围使用我们的 php,以便循环正常工作,并且幻灯片会相应地更新..

我遇到的问题是,第一次触发 LI 时,它必须没有 display:none,原因很明显.. LI 标签的所有其他后续出现都被隐藏了。

正如您从小提琴中看到的那样,除了第一个 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>
4

2 回答 2

1

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

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

在 php 中,将所有 div 设置为 display:none

于 2012-04-20T04:40:12.750 回答
0

利用:

    <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>
于 2012-04-20T04:37:28.403 回答