2

我正在尝试使用引导按钮切换背景图像。

我在css...

body { 
   background-image: url('img/myimage_1.gif');
}

在 HTML...

<button type="button" id="bkgchange" class="btn" data-toggle="button">Change the background</button>

并在脚本中...

$( 'bkgchange' ).click(function() {
    $( #body ).css( 'background-image', '~/img/myimage_2.gif' );
});

而且它不工作？！任何指针。我知道想要弄乱正文属性是非常规的，我不能将图像作为 div 背景或容器中，因为它本身不会表现...

与直接解决方案一样受欢迎的替代方案。

4

2 回答 2

0

尝试这个

$( '#bkgchange' ).click(function() {
    $('body').css( 'background-image', 'url(/img/myimage_2.gif)' );
});

bkgchange是你的按钮id，所以如果你想通过 jQuery 访问它，你需要放在#它之前。喜欢$('#bkgchange')并且您想body从页面访问元素，因此您需要通过$('body')而不是$(#body).

对于放置background-image，它的模式是url(path-of-image)，并且你不能使用~/url 因为 css 不知道它应该引用根目录，你可以尝试/引用根目录。

于 2013-10-18T16:10:57.130 回答
0 
$( '#bkgchange' ).click(function() {
   $('body').css( 'background-image', 'url(http://terangatimes.com/wp-content/uploads/2013/02/html-pointing-sign-clipart.jpg)' );
});

http://jsfiddle.net/B72sv/

您缺少#通过 id 获取 bkgchange 按钮。而且您body不需要#您不按 id 选择它。

另外，您缺少url(css 上的内容，并确保您的图像的 url 是完整路径。

$( 'bkgchange' ).click(function() { $( #body ).css( 'background-image', '~/img/myimage_2.gif' ); });

于 2013-10-18T16:12:15.200 回答