我试图按顺序显示和隐藏列表元素(我无法建议单个类这样做),即延迟。
这是我的 html...
<ul id="aclass">
<?php for ($i = 0; $i < count($enties); ++$i) :
<li class="animation">
<div id="frame">
</div>
</li>
<?php endfor; ?>
</ul>
目前为止
$(document).ready(function() {
function showpanel() {
$("ul#aclass > li").each(function() {
$(this).css("display", "none");
});
setTimeout(showpanel, 200)
});
我想看到第一个 li 元素两秒钟,然后替换第二个 li 元素两秒钟,然后是下一个等等。 我不知道如何选择“下一个”li 元素并依次在每个元素上运行该函数。
感谢您的帮助。
最佳答案
创意解决方案:
- CSS:隐藏除第一个面板之外的所有面板(在
:first-child
的帮助下) - jQuery:定期将第一个 child 移动到末尾。
$(document).ready(function() {
var panelInterval;
panelInterval = setInterval(function () {
$("ul#aclass > li:first-child").appendTo("ul#aclass");
}, 200)
});
ul#aclass > li {
display: none;
}
ul#aclass > li:first-child {
display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="aclass">
<li>Panel 1</li>
<li>Panel 2</li>
<li>Panel 3</li>
<li>Panel 4</li>
<li>Panel 5</li>
</ul>
关于javascript - 显示和隐藏序列中的列表元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29879532/