0

我按顺序进行了页面设置和导航。我的背景图像也正确显示。现在我的目标是让背景图片在点击时改变。

我的背景是在“general.css”样式表中实现的

html { 
  background: url(../images/bg1.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

我的导航有自己的“nav.css”和“nav.js”，当前的点击功能是

$('#action1').click(
    function(){
        if ($('#inner1').height() == 0 )
        $('#inner1').animate({height:'250'},800);
        else  if ($('#inner1').height() == 250 )
        $('#inner1').animate({height:'0'},800);
    }
);

我想当您单击 action1、action2 或 action3 时，它将 html 样式下的图像的 url 更改为 UNIQUE 背景。我将为每个 onclick 提供 3 个单独的背景。（以下）

background: url(../images/bg1.jpg) no-repeat center center fixed;

如果有人能给我一些关于如何更改 URL 值 onclick 的提示，将不胜感激。我需要更改背景网址，但不需要更改其他样式。下面最后一个例子。

html { 
  background: url(   CHANGE THIS VALUE ONCLICK   ) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
4

1 回答 1

1

你试过使用 jQuery 的CSS 函数吗？

因此，向点击侦听器添加这样的行可能会起作用：

$('html').css("background-image", "url(../images/bg1.jpg)");
于 2013-04-07T20:27:41.723 回答