将php中的图像从mysql数据库动态加载到jquery滑块中

将php中的图像从mysql数据库动态加载到jquery滑块中,php,mysql,Php,Mysql,我编写了一个web应用程序,其中包括让用户将图片上传到站点。在主页上,我动态显示用PHP上传的最新图片/项目,限制为10个。然而,这个页面看起来很静态,我已经在谷歌、bing、ask、yahoo等网站上搜索了好几天,还没有找到任何答案 我已经编写了代码来存储图像,并从数据库中获取它们。 图像显示在主页上,我唯一要做的就是将其加载到滑块中 $sql = mysql_query("SELECT * FROM items ORDER BY item_date_added DESC LIMIT 10")

我编写了一个web应用程序,其中包括让用户将图片上传到站点。在主页上,我动态显示用PHP上传的最新图片/项目,限制为10个。然而,这个页面看起来很静态,我已经在谷歌、bing、ask、yahoo等网站上搜索了好几天,还没有找到任何答案


我已经编写了代码来存储图像,并从数据库中获取它们。 图像显示在主页上,我唯一要做的就是将其加载到滑块中

$sql = mysql_query("SELECT * FROM items ORDER BY item_date_added DESC LIMIT 10")or die(mysql_error());
while($row = mysql_fetch_array($sql)) {
    //$user_id = $row['user_id'];
    $item_name = $row['item_name'];
    $item_id = $row['item_id'];

    $check_pic = "users/$item_name.jpg";

    if (file_exists($check_pic)) {
        $show_pic = "<img src=\"users/$item_name.jpg\" width=\"100px\" height=\"100px\" border=\"5\" id='img'/>";

        //$user_pic3 = "<img src=\"users/$rid/image01.jpg\" width=\"50px\" height=\"50px\" border=\"1\" />";
        //$MemberDisplayList .= '<a href="profile2/index.php?id=' . $rid . '">' . $user_pic3 . '</a>';
        $i++;
        $show_new_items .= "<a href='item_view?item_id=$item_id&&session_item=$item_id'>$show_pic</a>";
    }
    $newly_listed_names .= " <a href='item_view?item_id=$item_id&&session_item=$item_id'> $item_name </a> | ";
}
/////////结束显示新添加的项目///////////////////////////////////////////////////

中新添加的项目在正文中的一个div中出现回声


谁能帮帮我吗!这已经困扰了我一段时间了。谢谢。

您可以使用jquery插件,例如。或者你可以尝试不同的jquery插件。并将其与代码集成。

您可以使用jquery插件,如。或者你可以尝试不同的jquery插件。并将其与代码集成。

要使用Nivo,您需要生成如下所示的html。。。并打开demo.html以获取完整的源代码

因此,您只需在slider div内的循环中输出图像


要使用Nivo,您需要生成如下所示的html。。。并打开demo.html以获取完整的源代码

因此,您只需在slider div内的循环中输出图像



你是说像。在主页上,它正在动态检索图像并加载到slider。我已经编写了代码来存储图像,并从数据库中获取它们。图像显示在主页上,我唯一要做的就是将其加载到滑块中。jquery插件尚未设置。这就是我遇到的问题。好的,给我一分钟来发布代码。你可以使用jquery插件,比如。或者你可以照这个做。我试过nivo,但没办法弄明白。你是说像。在主页上,它正在动态检索图像并加载到slider。我已经编写了代码来存储图像,并从数据库中获取它们。图像显示在主页上,我唯一要做的就是将其加载到滑块中。jquery插件尚未设置。这就是我遇到的问题。好的,给我一分钟来发布代码。你可以使用jquery插件,比如。或者你可以按照这个来做。我试过nivo,但没办法解决。我不知道如何实现它们,有什么帮助吗?@rasheeda检查这个。还有。我不知道如何实现它们,有什么帮助吗?@rasheeda检查一下。另外,谢谢,但是图像是从数据库加载的。就像foreach语句一样,显示它们。在我上面的脚本中从db中获得它之后,我应该这样做:foreach$a as$show_new_items{$c=$a},它将包含img src,但是这不能正常工作,有什么建议吗?您没有在db中存储图像-至少从您的代码片段中。您正在数据库中存储图像的路径。我已经用一个例子编辑过了,对不起,我正在把图片储存在一个文件夹里。非常感谢,我会实施它并让您知道结果,谢谢!:它可以工作,但图像大小太大了。我如何管理它们?我更改了哪个.css文件?@pratik您可以使用css调整图像大小-只需在打印行中添加一个类-但这意味着客户端正在下载一个大图像,然后调整其大小。更好的方法是预先调整图像大小,或者使用缩略图脚本动态调整大小。当用户看不到大图像时,为什么要让用户下载它?谢谢,但是图像是从数据库加载的。就像foreach语句一样,显示它们。在我上面的脚本中从db中获得它之后,我应该这样做:foreach$a as$show_new_items{$c=$a},它将包含img src,但是这不能正常工作,有什么建议吗?您没有在db中存储图像-至少从您的代码片段中。您正在数据库中存储图像的路径。我已经用一个例子编辑过了,对不起,我正在把图片储存在一个文件夹里。非常感谢,我会实施它并让您知道结果,谢谢!:它可以工作,但图像大小太大了。我如何管理它们?我更改了哪个.css文件?@pratik您可以使用css调整图像大小-只需在打印行中添加一个类-但这意味着客户端正在下载一个大图像,然后调整其大小。更好的方法是预先调整图像大小,或者使用缩略图脚本动态调整大小。当用户看不到大图像时,为什么要让用户下载它?
<div id="wrapper">
    <div class="slider-wrapper theme-default">
        <div id="slider" class="nivoSlider">
    <?php
        while($row = mysql_fetch_array($sql)){
            $item_name = $row['item_name'];
            $item_id = $row['item_id'];
            $check_pic = "users/$item_name.jpg";
            if (file_exists($check_pic)) {
                print "<img src=\"users/$item_name.jpg\"/>";
                $i++;
            }
        }
    ?>
            <img src="images/2.jpg" data-thumb="images/2.jpg" alt=""/>
        </div>
    </div>
</div>

<script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../jquery.nivo.slider.js"></script>
<script type="text/javascript">
$(window).load(function() {
    $('#slider').nivoSlider();
});
</script>