【问题标题】:Dynamically changing background color in bootstrap在引导程序中动态更改背景颜色
【发布时间】:2015-04-23 14:00:56
【问题描述】:

我是新手。经过研究,我了解到我可以使用 javascript 来更改背景颜色。我想动态更改特定容器的背景颜色或图像。我正在使用样式 .css 文件的外部链接

(例如: href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">

href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap->theme.min.css"> )。

【问题讨论】:

    标签: javascript jquery css twitter-bootstrap


    【解决方案1】:

    您可以使用 jQuery 并执行以下操作:

    要更改 bc 图像:

    $('.YourContainer').css('background-image', 'url(../images/backgrounds/bc-image.jpg)');
    

    改变 bc 颜色:

    $('.YourContainer').css("background-color", "yellow");
    

    不要忘记添加 jQuery:

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

    编辑,因为您可能不知道如何在嵌入的脚本标签中使用代码:

            <!doctype html>
            <html>
            <head>
                <meta charset="utf-8">
                <title>Demo</title>
            </head>
            <body>
                <a href="http://jquery.com/">jQuery</a>
                <script src="jquery.js"></script>
                <script type='text/javascript'>
    
                $( document ).ready(function() {
    
    
    
               $('.YourContainer').css('background-image', 
                 'url(../images/backgrounds/bc-image.jpg)');
    
    
    
               });     
            </script>
        </body>
        </html>
    

    Live Demo

    【讨论】:

    • jquery 代码是否会进入嵌入脚本标签的函数中?
    • 确保在 jquery 调用后调用嵌入代码
    • 这就是我所拥有的。我没有看到调用 colorize 函数。
    • 这就是它的名称
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-06-28
    • 2014-04-05
    • 2015-10-22
    • 2014-06-06
    • 2016-02-20
    相关资源
    最近更新 更多