简单的轮播图(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>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM