javascript - 根据一天中的时间和一周中的某一天更改背景?

标签 javascript html

我试图让背景根据一周中的某一天和一天中的时间而变化。我在这里看到过类似的问题,但没有一个让我知道哪里出了问题。

CSS:

    <style type="text/css">
    img.bg {
        min-height: 100%;
        min-width: 1024px;
        width: 100%;
        height: auto;
        position: fixed;
        top: 0;
        left: 0;
    }

    @media screen and (max-width: 1024px) {
        img.bg {
            left: 50%;
            margin-left: -512px;
        }
    }
</style>

脚本:

function setbkg(){
    var d = new Date(),
    w = d.getDay(),
    h = d.getHours(),
    i;
        if(w = 0) {
            if (h = 0 || h = 1 || h = 14 || h = 15) i = "img/one.png";
            else if (h = 2 || h = 3 || h = 6 || h = 7 || h = 20 || h = 22 || h = 23) i = "img/two.png";
            else i = "img/three.png";
        }
        else if(w = 1) {
            if (h = 0 || h = 1) i = "img/one.png";
            else if (h = 2 || h = 3 || h = 6 || h = 7) i = "img/two.png";
            else if (h = 12 || h = 13) i = "img/three.png";
            else if (h = 22 || h = 23) i = "img/four.png";
            else i = "img/five.png";
        }
        else if(w = 2 || w = 3 || w = 4 || w = 5) {
            if (h = 0 || h = 1 || h = 12 || h = 13) i = "img/one.png";
            else if (h = 2 || h = 3 || h = 6 || h = 7 || h = 22 || h = 23) i = "img/two.png";
            else i = "img/three.png";
        }
        else if(w = 6){
            if (h = 0 || h = 1) i = "img/one.png";
            else if (h = 2 || h = 3 || h = 6 || h = 7) i = "img/two.png";
            else if (h = 14 || h = 15) i = "img/three.png";
            else if (h = 20 || h = 22 || h = 23) i = "img/four.png";
            else i = "img/five.png";
        }
        else{ i = "i.imgur.com/wNOr5VU.png" }

        document.write('<img src="' + i + '" class="bg">');
    }

在头部之后,

<body onload="setbkg()">

我确信这是一种非常低效的方法来实现这一目标,但我仍然是一个初学者。现在,什么也没有发生,我看到的是白屏。想法?

最佳答案

在每个 if block 中,您都使用“=”运算符。它是赋值运算符。在每个 if 条件中使用“==”,您的代码将起作用。

以下是代码的较小版本。并且它工作正常。我刚刚将两个图像与index.html 保存在同一目录中。

<html>
<head>
    <title>test main</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style type="text/css">
        img.bg {
            min-height: 100%;
            min-width: 1024px;
            width: 100%;
            height: auto;
            position: fixed;
            top: 0;
            left: 0;
        }

        @media screen and (max-width: 1024px) {
            img.bg {
                left: 50%;
                margin-left: -512px;
            }
        }
    </style>
    <script>
        function setbkg(){
            var d = new Date(),
            w = d.getDay(),
            h = d.getHours(),
            i;
            if(w == 3) {

                i = "body-img.jpg";

            }
            else{ i = "large.jpg" }

            document.write('<img src="' + i + '" class="bg">');
        }
    </script>
</head>
<body onload="setbkg()">

</body>
</html>

关于javascript - 根据一天中的时间和一周中的某一天更改背景?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24148985/

相关文章:

JavaScript:如何复制对象?

javascript - 鼠标悬停时显示像素数

javascript - 无法在html中添加垂直滚动条?

html - 如何动态定义行空间

html - 使用 CSS 将悬停效果应用于标题

javascript - php服务器无法使用$.http().post请求从angularjs接收json变量

javascript - 在 getJSON 中编写 ajax 调用的失败案例

javascript - 将图像添加到给定链接的表中

javascript - 在窗口加载时使用 JS 打印 html 表格

javascript - HTML Preloader 应该放在哪里?