Question

如何使用fadein逐个循环从mysql加载数据？

好的，我将从mysql total 40 image

加载图片

然后我要显示

<li class="img" style=" list-style: none; float: left; margin: 7px; width: 80px; ">
    <img src="<?PHP echo $img_products[0]; ?>"/>
</li>

与fadein和delay 0.5 sec.然后显示

<li class="img" style=" list-style: none; float: left; margin: 7px; width: 80px; ">
    <img src="<?PHP echo $img_products[1]; ?>"/>
</li>

与fadein和delay 0.5 sec.然后显示

<li class="img" style=" list-style: none; float: left; margin: 7px; width: 80px; ">
    <img src="<?PHP echo $img_products[2]; ?>"/>
</li>

与fadein和delay 0.5 sec.然后显示

<li class="img" style=" list-style: none; float: left; margin: 7px; width: 80px; ">
    <img src="<?PHP echo $img_products[3]; ?>"/>
</li>

直到显示

<li class="img" style=" list-style: none; float: left; margin: 7px; width: 80px; ">
    <img src="<?PHP echo $img_products[39]; ?>"/>
</li>

我尝试使用loop for PHP来做到这一点，但不行，我该怎么做？

<?PHP 
for($i=0;$i<40;$i++)
{
    $strSQL = "SELECT * FROM products WHERE data_type = '$strID' order by id desc Limit $i,1 ";
    $objQuery = mysql_query($strSQL) or die ("Error Query [".$strSQL."]");
    $objResult = mysql_fetch_array($objQuery);
    $img_products[$i] = $objResult["img_path"];
}


for($i=0;$i<40;$i++)
{
<li class="img" style=" list-style: none; float: left; margin: 7px; width: 80px; ">
    <img src="<?PHP echo $img_products[$i]; ?>"/>
</li>
}
?>

Answer 1

好的，你需要在php中输出所有40张图片的html。进行40次查询是不合逻辑的，所以我改变了这一点，进行了1次查询，结果限制为40次。

<?php
$strSQL = "SELECT * FROM products WHERE data_type = '$strID' order by id desc Limit 40";
$objQuery = mysql_query($strSQL) or die ("Error Query [".$strSQL."]");
while($row = mysql_fetch_array($objQuery)):?>

    <li class="img" style="display:none; list-style: none; float: left; margin: 7px; width: 80px; ">
        <img src="<?php echo $row["img_path"]; ?>"/>
    </li>

<?php endwhile;?>

另请注意，<li>标记使用display:none;隐藏了css。然后使用javascript（在这种情况下使用jquery），你可以循环遍历所有li标签，并设置一个计时器来显示它们。循环的工作原理是将每个项目的timout增加500毫秒：

<script src='http://code.jquery.com/jquery-1.11.0.min.js'></script>
<script>
$(function(){
    $('li.img').each(function(index){
        $(this).delay(500*index).fadeIn(400);
    });
});
</script>

强制性说明：mysql_ *函数已弃用。你应该使用mysqli_ *或pdo代替

如何用fadein逐个循环从mysql加载数据？

1 个答案: