无法获得适合身体元素背景的图像

Question

我现在坐在这里试图为我的xfce设置编写一个像样的登录页面。

当有人输入错误的密码时，我想要更改个人资料图片和背景图片。我目前正在努力改变背景，但它不会拉伸它以适应我的屏幕，因为我需要javascript来运行background-size: cover;。

我当前的javascript行目前是document.body.style.background = " #000000 url('images/bg.gif') no-repeat center fixed"; JQuery不是一个选项，不要问为什么。它只是不是。

请，谢谢你。

Answer 1

正如您所说，您可以使用document.body.style.backgroundSize = "cover"强制背景“填满屏幕”。

Answer 2

建议（更容易和可维护）使用CSS类来设置页面样式并使用JS来切换类。

因此，在您的情况下，JavaScript可以是：

document.body.className = 'wrong-password';

和CSS将是：

<style>
   .wrong-password {
      background: #000000 url('images/bg.gif') no-repeat center fixed;
      background-size: cover;
   }
</style>

您可以轻松添加更多样式，甚至可以轻松更改儿童风格（例如头像），如下所示：

<style>
   .wrong-password .avatar {
      display: none;
   }

   .wrong-password .some-placeholder {
      display: block;
   }
</style>