更改正文中的背景图像

一尘不染

更改正文中的背景图像

css

如何在运行时更改CSS中的背景图片？我的体内有以下背景图像，可以在运行时更改图像吗？

body {
height: 100%;
background: #fff8db url(../images/backgrounds/header-top.jpg) no-repeat center top; 
/*background-color: #fff8db;*/
/*background-size: 1650px 900px;*/
font-family: Arial, Verdana, Helvetica, sans-serif; 
font-size:12px; 
font-weight:normal; 
color:#404040;
line-height:20px; }

阅读 221

2020-05-16

共1个答案

一尘不染

如果已经加载了JQuery，则可以执行以下操作：

$('body').css('background-image', 'url(../images/backgrounds/header-top.jpg)');

编辑：

首先在head标签中加载JQuery：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

然后，当页面上发生某些事情（例如加载完成时）时，调用Javascript更改背景图片：

<script type="text/javascript">
    $(document).ready(function() {
        $('body').css('background-image', 'url(../images/backgrounds/header-top.jpg)');
    });
</script>

2020-05-16