Jquery如何改变你的网站背景

Jquery how to change your website background?

本文关键字：网站 背景 改变 何改变 Jquery      更新时间：2023-09-26

在我的网站中，我有这样的css:

body { 
  background: #FFF url(../images/bg.jpg) no-repeat center fixed;
}

它设置了我的背景图片，我想做的是当用户加载某个页面时背景图片会发生变化，不仅仅是当前页面，而是所有页面。

我该怎么做呢?

现在我有这样的脚本:

<script>
document.body.style.background="#FFF url('../images/bg2.png') no-repeat center fixed";
</script>

所以它改变了我的背景图像但只针对当前页面，其他都加载了默认的背景图像定义在css中:(

我没有提到在我想要改变背景的页面中提供了图像的名称，它是动态的

用户操作示例:这里我们要去的网站，如www.example.com和有一些背景，我改变页面到www.example.com/account，我有相同的背景，当我去www.example.com/change我想改变我的背景图像所以当我再次进入www.example.com/account图像也被改变了

将您的script写入一个文件，并将该文件包含在使用<script>标记的所有页面中。

另一个解是-

在所有页面都写脚本!但我不认为你想做重复的工作，因为如果有一天你打算改变剧本，你必须改变所有的页面。但是在我提到的第一个解中，你只需要改变一个地方。

补充道:

根据你的评论，我能想到的是-

1-创建一个全局变量，它在你网站上的所有页面上都是持久的。在每次加载页面之前，检查它是真还是假。如果是真的，请使用旧背景。如果为假，则使用新背景。默认设置为true，当您打开www.example.com/change页面时，将其设置为false。

2-放置CSS的背景在一个文件。当您加载这个www.example.com/change页面时，更改这个文件的内容。

使用HTML5 localStorage来存储样式。

加载时:

$("body").css("background",localStorage.style);

 simply by : 
$('body').css('background','url(imagefile.png)');

试试这些

$(this).css('background-color', 'red');

或

$(this).css("background", "url('../images/r-srchbg_white.png'))

或

$(this).parent().css("background", "url('../images/r-srchbg_white.png') no-repeat");

你可以使用所有页面的默认布局…比如主页......

仅在母版页正文中，您将加载所有页面的html，

如果用户加载了特定的页面，那么更改母版页的背景图像将影响到所有页面，因为所有页面都继承自母版页

相关文章：