Question

我有这个jQuery调用下拉列表。单击时，内部容器的背景图像将更改其背景图像。如何更改内部容器的背景图像？

$(document).ready(function () {
  $('#listH1').click(function () {
    $('#content1').slideToggle('medium');
    $(".span").css("background-image","url(carrow.png)");  
  });
});

Answer 1

我建议使用toggleClass()：

<强> CSS

.yourNewBackground {
    background-image: url(carrow.png);
}

<强>的JavaScript

$(document).ready(function () {
  $('#listH1').click(function () {
    $('#content1').slideToggle('medium');
    $(".span").toggleClass("yourNewBackground");
  });
});

修改

这是a working fiddle。有几点需要注意：

使用小提琴时，请确保选择适当的框架。你选择了MooTools（默认），而不是jQuery。
由于toggleClass()课程，
span无效。只需要!important类添加toggleDown即可。

Answer 2

如果在样式表文件中设置了背景，您只需删除在那里创建的自定义style - 属性：

$(".span").css('background-image', '');

返回jQuery单击函数css更改回来

2 个答案: