2

我正在尝试更改bodyRails 应用程序标签中的背景图像。我已经从 items.js.coffee (我有名为 items 的表)和 application.js 中尝试过它。我不能让它工作。

我试图更改背景颜色,这可以从 application.js 工作,但不能从 items.js.coffee 工作。

所以我的问题是:如何更改背景图像,CSS 中的所有更改都必须从 application.js 完成吗?

items.js.coffee:

$ ->
    $(document).ready ->
        if something
            $("body").css "background-image", "url(rails.png)"

bootstrap_and_overrides.css.less:

body { 
    padding-top: 60px;
    background-color: black;
    background-image:url('HypeTrans.png');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position: 50% 50%;
}
4

3 回答 3

3

似乎最可能的解释是,如果您使用资产管道,您的布局或 application.js 中没有包含 items.js 文件。

在开发模式下,查看渲染页面的源代码*并确认页面中包含 items.js。如果不是,并且假设您使用的是 Rails 3.1+ - 我建议您查看Asset Pipeline Rails 指南以了解如何将文件添加到清单中。

  • 我建议这样做,因为无论您是否使用资产管道,它都应该工作,因为在您的 application.js 清单中的开发模式文件是单独包含的。

更新

与此相关的是,如果您指的是从资产管道提供的资产,它们将出现在 /assets 下,因此您的代码应该是

$("body").css "background-image", "url('/assets/rails.png')"
于 2012-11-29T13:43:02.693 回答
0

我向你展示了一种用 javascript 编写 css 代码的方法,所以你可以试试这个

$(function(){
    if(something){
        $("body").css({
            'background-image':'url(path of the image)'
        })
    }
})

这样就可以写css

于 2012-11-29T13:53:31.887 回答
0

为什么不将背景图像更改为背景

bootstrap_and_overrides.css.less

所以让它看起来像这样

body { 
padding-top: 60px;
background-color: black;
background:url('HypeTrans.png');
background-repeat:no-repeat;
background-attachment:fixed;
background-position: 50% 50%;

}

于 2012-11-29T14:02:14.633 回答