背景：
以下脚本用于HTML滑块。编写Jquery时每10秒旋转一次幻灯片。打开或刷新页面后，第一则广告会显示20秒。
知道为什么吗？
这是我的剧本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='UTF-8'>
<title>Current Ads Display</title>
<style>
object {
/* Set rules to fill background */
min-height: 100%;
min-width: 1024px;
/* Set up proportionate scaling */
width: 100%;
height: 100%;
/* Set up positioning */
position: fixed;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"> </script>
<script>
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$('#slideshow > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow');
}, 10000);
<body>
<?PHP
echo "<div id='slideshow'>";
//Getting ads from the database
require_once('connect_pdo.php');
$sqlst = $conn->prepare("SELECT `adslist` FROM ADS");
$sqlst->execute();
while($resultst = $sqlst -> fetch()){
$adlist = $resultst["adslist"];
echo "<div class='slideshow'>";
//Display ad as an image
//<object data='/$adlist'></object>
echo "<object data='/$adlist'></object>";
echo "</div>";
}
echo "</div>";
?>
</body>
</html>
最佳答案
删除外部的hide选项，并在间隔内将其起作用。
<script>
setInterval(function() {
$('#slideshow > div:first').fadeOut(0).next().fadeIn(0).end().appendTo('#slideshow');
$("#slideshow > div:gt(0)").hide();
}, 10000);