根据当前网址更改CSS div或正文背景图片

Question

我需要这样做的原因是，我正在工作的网站使用完全相同的模板来显示多个页面的动态内容。 所有页面都复制完全相同的div id，因为它们以相同的方式显示内容（标题内容除外！）。 标头内容缩短了，但是div id仍然保留在源代码中。

博客索引页面需要显示1个背景图像，而网站上的其他页面都需要显示另一个背景图像。

在此先感谢您的帮助。

Answer 1

此代码段将满足您的要求：

if (window.location.href.indexOf('somepart_of_the_url') != -1) {
    //Change background to some div
    $('#somediv').css('backgroundImage','url(images/mybackgroundimage.jpg)');
    //Change background to page body
    $("document.body").css('backgroundImage','url(images/mybackgroundimage.jpg)');
}

Answer 2

我经常根据模板或请求路径为body类命名。 我知道您说过，它们都使用相同的模板，但是该模板具有参数，并且其中一个参数应该是

body_class

而且，无论您在网站中填充了什么控制器或动态内容并呈现了模板，都应该在/时将其传递给“ home”。 根据我以前的经验，我还将传递其他内容，以便/ blog / category / post可能具有类似于

<body class="post two-column-a">

然后，您的选择器如下所示：

body { ... }
body.home { ... }

Answer 3

这有效：

<script language="javascript">
$(document).ready(function() {
if (window.location.href.indexOf('INDEX_URL') != -1) {
//Change background
$('#DIV_ID').css({'background-image': 'url(http://URL.com/images/BG.jpg)', 'background-repeat': 'repeat-x', 'background-position': 'center top', 'width': '100%!important', 'min-height': '400px'});
}
});
</script>

但是，此代码的缺陷在于，如果您将目录插入“ INDEX_URL”（例如/ folder /），则/ folder /之后的任何页面都会具有该背景。

根据当前网址更改CSS div或正文背景图片

问题描述

3 个解决方案

解决方案1
1 2012-09-15 00:32:57

解决方案2
0 2012-09-15 00:36:39

解决方案3
0 2012-09-15 17:34:39

根据当前网址更改CSS div或正文背景图片

问题描述

3 个解决方案

解决方案1 1 2012-09-15 00:32:57

解决方案2 0 2012-09-15 00:36:39

解决方案3 0 2012-09-15 17:34:39

解决方案1
1 2012-09-15 00:32:57

解决方案2
0 2012-09-15 00:36:39

解决方案3
0 2012-09-15 17:34:39