Under my umbrella.

SKII

Less is more.

简单的轮播图(Java Script)

使用JS制作简单的轮播图

  • 利用了setInterval的滚动性,也可以用while+setTimeout替代。
<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>Java Script Test Place</title>
</head>
<body>
    <img id="img" src="WEB-INF/images/one.jpg" width="100%">

    <script>
        var img=document.getElementById("img");
        var cnt=0;
        setInterval(fun, 2*1000);

        function fun(){
            switch (cnt) {
                case 0:
                    img.src="WEB-INF/images/one.jpg";
                    cnt=(cnt+1)%3;
                    break;
                case 1:
                    img.src="WEB-INF/images/two.jpg";
                    cnt=(cnt+1)%3;
                    break;
                case 2:
                    img.src="WEB-INF/images/three.jpg";
                    cnt=(cnt+1)%3;
                    break;
                default:
                    document.write("<h1>Wrong...</h1>");
                    break;
            }
        }
    </script>
</body>
</html>
posted @ 2020-03-15 17:59  NLYang  阅读(1246)  评论(0编辑  收藏  举报