php按时更改图像_Php_Html_Css - Fatal编程技术网

php按时更改图像

php html css

php按时更改图像,php,html,css,Php,Html,Css,我发表了一篇关于这一点的帖子：现在我有时间工作，但仍然需要正确更改4幅图像我制作了一个包含4张图片的div，但现在图片需要在特定时间更改。我给所有的图像类“images”，并在css中将显示设置为none，但是图像仍然会显示出来 <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="t

我发表了一篇关于这一点的帖子：现在我有时间工作，但仍然需要正确更改4幅图像

我制作了一个包含4张图片的div，但现在图片需要在特定时间更改。我给所有的图像类“images”，并在css中将显示设置为none，但是图像仍然会显示出来

   <!DOCTYPE html>
<html lang="en">
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <link rel="stylesheet" href="Site.css">
   <title>PHP time based page</title>
</head>
<body>

<?php
date_default_timezone_set("Europe/Amsterdam");
function getTime() {
    $Time = explode(" ", date('h:i A'));
    $time = $Time[0];
    if (($Time[1] === "PM") && ($time !== "00:00")) {
        $temp = explode(":", $time);
        $temp[0] = ((int)$temp[0]) + 12;
        $time = implode(":", $temp);
    }
    $Moment = "";

    if (($time >= "06:00") && ($time < "12:00")) {
        $Moment = $Moment . "morning";
        define("TIME", "Goodmorning!");
    }
    else if(($time >= "12:00") && ($time < "18:00")){
        $Moment = $Moment . "afternoon";
        define("TIME", "Goodafternoon!");
    }
    else if(($time >= "18:00") && ($time < "24:00")){
        $Moment = $Moment . "evening";
        define("TIME", "Goodevening!");
    }
    else {
        $Moment = $Moment . "night";
        define("TIME", "Goodnight!");
    }

    return ["moment" => $Moment, "time" => $time];
}

function getGreeting() {
    return "Good ".getTime()["moment"].", it is now ".getTime()["time"];
}

$images = [
    "morning",
    "afternoon",
    "evening",
    "night"
];
?>

<p><?php echo getGreeting(); ?></p>
<div class="images">
    <?php
    $moment = getTime()["moment"]; 
    ?>
    <img src="images/<?php echo $moment; ?>.png" alt="<?php echo $moment; ?>">
</div>

 </body>
</html>

因此，如果这是页面，文本应该是这样的，图像需要更改

我会将images类重命名为invisible，以反映它应该做得更好，比如

.invisible {
    display: none;
}

让我们创建一个包含以下时间的PHP数组：

$images = [
    "morning",
    "afternoon",
    "evening",
    "night"
];

确保

getTime

返回文本且仅返回文本：

function getTime() {
    //Don't change the lines above the return statement
    return $Moment;
}

这是您可以操作的方式：

<div class="images">
    <?php
    $moment = getTime(); // Unfortunately getTime does some echoing, you will need to refactor it to separate representation from computation
    ?>
    <img src="images/<?php echo $moment; ?>.png" alt="<?php echo $moment; ?>">
</div>

您可以将其作为

echo getGreeting();

编辑3

我们需要时间和问候，做进一步的改进：

function getTime() {
    $Time = explode(" ", date('h:i A'));
    $time = $Time[0];
    if (($Time[1] === "PM") && ($time !== "00:00")) {
        $temp = explode(":", $time);
        $temp[0] = ((int)$temp[0]) + 12;
        $time = implode(":", $temp);
    }
    $Moment = "";

    if (($time >= "06:00") && ($time < "12:00")) {
        $Moment = $Moment . "morning";
        define("TIME", "Goodmorning!");
    }
    else if(($time >= "12:00") && ($time < "18:00")){
        $Moment = $Moment . "afternoon";
        define("TIME", "Goodafternoon!");
    }
    else if(($time >= "18:00") && ($time < "24:00")){
        $Moment = $Moment . "evening";
        define("TIME", "Goodevening!");
    }
    else {
        $Moment = $Moment . "night";
        define("TIME", "Goodnight!");
    }

    return ["moment => "$Moment, "time" => $time];
}

并将图像div更改为

<div class="images">
    <?php
    $moment = getTime()["moment"]; // Unfortunately getTime does some echoing, you will need to refactor it to separate representation from computation
    ?>
    <img src="images/<?php echo $moment; ?>.png" alt="<?php echo $moment; ?>">
</div>


.png“alt=”“>

编辑4


基于时间的网页

.png“alt=”“>

我用自己的代码编辑了这篇文章，上面写着你刚才解释的内容。我还是不太明白。带时间的图像/文本立即消失now@ptrique您有一个CSS规则，它隐藏了包含图像的div。如果该规则仍然存在，则需要删除该规则。它看起来像

.images{display:none；}

。图像是否存在？如果我删除该选项，则所有4个图像都会显示在彼此下方，这可能是因为我猜所有4个图像都在一个div中。@ptrique我期待这条评论。您有两个包含图像的div。一个div是.images div中的一个，它显示一个single图像，动态加载图像是很有用的。另一种方法不需要生成所有四个图像。你是一个好人，大多数时候人们在问了几个问题后就不再帮我了，但是你几乎从一开始到最后都帮了我。再次感谢你

function getGreeting() {
    return "Good ".getTime().", it is now {$time}";
}

echo getGreeting();

function getTime() {
    $Time = explode(" ", date('h:i A'));
    $time = $Time[0];
    if (($Time[1] === "PM") && ($time !== "00:00")) {
        $temp = explode(":", $time);
        $temp[0] = ((int)$temp[0]) + 12;
        $time = implode(":", $temp);
    }
    $Moment = "";

    if (($time >= "06:00") && ($time < "12:00")) {
        $Moment = $Moment . "morning";
        define("TIME", "Goodmorning!");
    }
    else if(($time >= "12:00") && ($time < "18:00")){
        $Moment = $Moment . "afternoon";
        define("TIME", "Goodafternoon!");
    }
    else if(($time >= "18:00") && ($time < "24:00")){
        $Moment = $Moment . "evening";
        define("TIME", "Goodevening!");
    }
    else {
        $Moment = $Moment . "night";
        define("TIME", "Goodnight!");
    }

    return ["moment => "$Moment, "time" => $time];
}

function getGreeting() {
    return "Good ".getTime()["moment"].", it is now ".getTime()["time"];
}

<div class="images">
    <?php
    $moment = getTime()["moment"]; // Unfortunately getTime does some echoing, you will need to refactor it to separate representation from computation
    ?>
    <img src="images/<?php echo $moment; ?>.png" alt="<?php echo $moment; ?>">
</div>

  <!DOCTYPE html>
<html lang="en">
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <link rel="stylesheet" href="Site.css">
   <title>PHP time based page</title>
</head>
<body>

<?php
date_default_timezone_set("Europe/Amsterdam");
function getTime() {
    $Time = explode(" ", date('h:i A'));
    $time = $Time[0];
    if (($Time[1] === "PM") && ($time !== "00:00")) {
        $temp = explode(":", $time);
        $temp[0] = ((int)$temp[0]) + 12;
        $time = implode(":", $temp);
    }
    $Moment = "";

    if (($time >= "06:00") && ($time < "12:00")) {
        $Moment = $Moment . "morning";
        define("TIME", "Goodmorning!");
    }
    else if(($time >= "12:00") && ($time < "18:00")){
        $Moment = $Moment . "afternoon";
        define("TIME", "Goodafternoon!");
    }
    else if(($time >= "18:00") && ($time < "24:00")){
        $Moment = $Moment . "evening";
        define("TIME", "Goodevening!");
    }
    else {
        $Moment = $Moment . "night";
        define("TIME", "Goodnight!");
    }

    return ["moment" => $Moment, "time" => $time];
}

function getGreeting() {
    return "Good ".getTime()["moment"].", it is now ".getTime()["time"];
}

$images = [
    "morning",
    "afternoon",
    "evening",
    "night"
];
?>

<p><?php echo getGreeting(); ?></p>
<div class="images">
    <?php
    $moment = getTime()["moment"]; 
    ?>
    <img src="images/<?php echo $moment; ?>.png" alt="<?php echo $moment; ?>">
</div>

 </body>
</html>