新手求大神指导图片循环切换显示问题。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title></title>
    <style type="text/css">
body {
margin: 0px;
text-align: center;
background: #fff;
overflow-x:hidden;
overflow-y:hidden;
}
     .gonggao {
width:1080px;
height:1920px;
}
    </style>
</head>
<body>
    <form id="form1" runat="server">

    <div style=display:block;>
        <img src="B5/old/b5-1.jpg" id="img1" width="1080px" height="1920px" class=gonggao />

    </div>
    </form>
</body>
<script type="text/javascript">
    var num=0;
    function run()
    {
        var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

        var img = document.getElementById("img1");
        for(var i=0;i<imgSrcs.length;i++)
        {
            if(i==num)
            {
                img.src=imgSrcs[i];
            }
        }
        if(num==2)
        {
            num=0;
        }
        else
        {
            num++;
        }
        setTimeout("run()",2000);
    }

    run();
</script>
</html>

6 个解决方案

#1

楼主做幻灯片吗？

#2

var num=0;
    function run()
    {
        var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

        var img = document.getElementById("img1");

                img.src=imgSrcs[i];

            num++;
       if(num>=imgSrcs.length ){
num=0;
}
        setTimeout("run()",2000);
    }

    run();

#3

引用 2 楼 hch126163 的回复:

var num=0;
    function run()
    {
        var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

        var img = document.getElementById("img1");

                img.src=imgSrcs[i];

            num++;
       if(num>=imgSrcs.length ){
num=0;
}
        setTimeout("run()",2000);
    }

    run();

更改为这段后为什么就固定在B5-1的图片上不动了？

#4



<script type="text/javascript">

    var num=0;

    var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>

#5

引用 4 楼 crystal_lz 的回复:



<script type="text/javascript">

    var num=0;

    var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>

这个代码是可以循环但是如果文件夹中没b5-3.jpg的话就会显示一页X。怎么才能如果没b5-3.jpg就跳过呢？因为B5/old目录下的文件是不固定的有时候可能只有B5-1 有时候可能有B5-1至B5-4这样的。这个代码固定了必须要有B5-1至B5-3。所以想求助怎么才能实现只循环显示文件夹内有的图片。比如只有B5-1时就固定显示B5-1有B5-1和B5-2时就在B5-1和B5-2直接循环，有B5-1至B5-4的话就在1-4之间循环这样的效果。

#6

引用 5 楼 kokpkdrow 的回复:

Quote: 引用 4 楼 crystal_lz 的回复:
<script type="text/javascript">

    var num=0;

    var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>
这个代码是可以循环但是如果文件夹中没b5-3.jpg的话就会显示一页X。怎么才能如果没b5-3.jpg就跳过呢？因为B5/old目录下的文件是不固定的有时候可能只有B5-1 有时候可能有B5-1至B5-4这样的。这个代码固定了必须要有B5-1至B5-3。所以想求助怎么才能实现只循环显示文件夹内有的图片。比如只有B5-1时就固定显示B5-1有B5-1和B5-2时就在B5-1和B5-2直接循环，有B5-1至B5-4的话就在1-4之间循环这样的效果。

那就没有办法了要么就动态生成你的js吧
我不知道你用的是什么语言以php为例



<script type="text/javascript">

    var num=0;

    echo 'var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];'//这里你动态生成

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>

#1

楼主做幻灯片吗？

#2

#3

引用 2 楼 hch126163 的回复:

var num=0;
    function run()
    {
        var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

        var img = document.getElementById("img1");

                img.src=imgSrcs[i];

            num++;
       if(num>=imgSrcs.length ){
num=0;
}
        setTimeout("run()",2000);
    }

    run();

更改为这段后为什么就固定在B5-1的图片上不动了？

#4



<script type="text/javascript">

    var num=0;

    var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>

#5

引用 4 楼 crystal_lz 的回复:



<script type="text/javascript">

    var num=0;

    var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>

#6

引用 5 楼 kokpkdrow 的回复:

Quote: 引用 4 楼 crystal_lz 的回复:
<script type="text/javascript">

    var num=0;

    var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>
这个代码是可以循环但是如果文件夹中没b5-3.jpg的话就会显示一页X。怎么才能如果没b5-3.jpg就跳过呢？因为B5/old目录下的文件是不固定的有时候可能只有B5-1 有时候可能有B5-1至B5-4这样的。这个代码固定了必须要有B5-1至B5-3。所以想求助怎么才能实现只循环显示文件夹内有的图片。比如只有B5-1时就固定显示B5-1有B5-1和B5-2时就在B5-1和B5-2直接循环，有B5-1至B5-4的话就在1-4之间循环这样的效果。

那就没有办法了要么就动态生成你的js吧
我不知道你用的是什么语言以php为例



<script type="text/javascript">

    var num=0;

    echo 'var imgSrcs = [ "B5/old/b5-1.jpg","B5/old/b5-2.jpg","B5/old/b5-3.jpg"];'//这里你动态生成

    function run()

    {

        var img = document.getElementById("img1");

        img.src=imgSrcs[num++];

        num %= imgSrcs.length;

        setTimeout("run()",2000);

    }

    run();

</script>

秒客网

新手求大神指导图片循环切换显示问题。

6 个解决方案

#1

#2

#3

#4

#5

#6

#1

#2

#3

#4

#5

#6

相关文章