Javascript jQuery幻灯片放映问题-幻灯片放映不起作用_Javascript_Jquery_Jquery Cycle2

Javascript jQuery幻灯片放映问题-幻灯片放映不起作用

javascript jquery

Javascript jQuery幻灯片放映问题-幻灯片放映不起作用,javascript,jquery,jquery-cycle2,Javascript,Jquery,Jquery Cycle2,我正在尝试创建一个网页，它将浏览文件夹中的所有内容，并以幻灯片的形式显示其内容。下面是我的基本代码，我尝试从glob（）获取结果，并显示文件夹pictures/中的所有.jpg文件 <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script s

我正在尝试创建一个网页，它将浏览文件夹中的所有内容，并以幻灯片的形式显示其内容。下面是我的基本代码，我尝试从

glob（）

获取结果，并显示文件夹

pictures/

中的所有.jpg文件

<!DOCTYPE html>



<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
<meta http-equiv="content-type" content="text/html; charset=utf-8" >
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">

body{
background-color: white;
}
</style>
</head>

<body>


<div class="cycle-slideshow"
    data-cycle-fx="scrollHorz"
    data-cycle-loader=true
    data-cycle-timeout="0"
    data-cycle-prev="#prev"
    data-cycle-next="#next"
    >
        <?php
        $folder = 'pictures/';
        $filetype = '*.jpg';
        $files = glob($folder.$filetype);
        $count = count($files);
        for ($i = 0; $i < $count; $i++) {
            echo '"'; echo '<img src="'.$files[$i].'" width="80%" height="60%"/>'; echo '"';
        }   
        ?>

</div>
</body>
</html>


身体{
背景色：白色；
}

有一个错误，永远不要使用id为的脚本标记，我认为这是错误的。只需删除脚本标记

<!DOCTYPE html>



<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
<meta http-equiv="content-type" content="text/html; charset=utf-8" >
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">

body{
background-color: white;
}
</style>
</head>

<body>


<div class="cycle-slideshow">
    <div class="cycle-prev" style="position:relative;float:left;cursor:pointer">PREV</div>
    <div class="cycle-next" style="position:relative;float:right;cursor:pointer">NEXT</div>
        <?php
        $folder = 'pictures/';
        $filetype = '*.jpg';
        $files = glob($folder.$filetype);
        $count = count($files);
        for ($i = 0; $i < $count; $i++) {
            echo '<img src="'.$files[$i].'" width="80%" height="60%"/>';
        }   
        ?>

</div>
</body>
</html>


身体{
背景色：白色；
}
上
下一个

如果以后要动态添加更多幻灯片，可以在脚本标记中创建图像数组。希望上述方法能奏效

我在进行此修复时仍然收到相同的错误。这是一件奇怪的事情。。我没有收到任何错误消息，只是除了背景之外，没有任何东西正确显示。如果幻灯片没有运行，可能会有错误，在chrome中按CTRL+SHIFT+I以查看控制台并重新加载页面。我已修复了该问题，它在这里工作，请复制我给出的全部代码。好的，现在我如何让我的图片通过单击按钮进行切换？我有很多大图片，内存太多，无法一次加载