我正在为我工作的公司制作一个扩展/崩溃电话费率表。我目前有一个表下面有一个按钮来展开它,按钮说“展开”。它是功能性的,除了我需要按钮改变为“折叠”时,它被点击,然后当然回到“展开”时,再次点击。按钮上的文字是背景图像。

所以基本上我所需要的是改变一个div的背景图像时,它被点击,除了有点像一个切换。


当前回答

$('#divID').css("background-image", "url(/myimage.jpg)");  

应该这样做,只是在元素上的点击事件中连接它吗

$('#divID').click(function()
{
  // do my image switching logic here.
});

其他回答

$('#divID').css("background-image", "url(/myimage.jpg)");  

应该这样做,只是在元素上的点击事件中连接它吗

$('#divID').click(function()
{
  // do my image switching logic here.
});

使用jQuery有两种不同的方法来更改背景图像CSS。

$('选择'). css(“分辨率”,“url(图片/ example.jpg)”); $('选择'). css({“背景图像”:“url(图片/ example.jpg)”});

仔细观察,注意不同点。在第二种方法中,您可以使用传统的CSS并将多个CSS属性串在一起。

这是一个相当简单的响应,使用项目列表更改网站的背景

function randomToN(maxVal) {
    var randVal = Math.random() * maxVal;
    return typeof 0 == 'undefined' ? Math.round(randVal) : randVal.toFixed(0);
};
var list = [ "IMG0.EXT", "IMG2.EXT","IMG3.EXT" ], // Images
    ram = list[parseFloat(randomToN(list.length))], // Random 1 to n
    img = ram == undefined || ram == null ? list[0] : ram; // Detect null
$("div#ID").css("backgroundImage", "url(" + img + ")"); // push de background

我总是使用时间戳来防止浏览器缓存图像。例如,如果用户正在旋转他们的头像,它通常会被缓存并且看起来没有改变。

var d = new Date();
var t = d.getTime();

$('#avatar').css("background-image", "url(" + iPath + "?" + t + ")");

旧帖子,但这将允许你使用图像精灵和调整重复,以及通过使用css属性的速记(背景,重复,左上角)的定位。

$.each($('.smallPreview'), function(i){
  var $this = $(this);

  $this.mouseenter(function(){
    $this.css('background', 'url(Assets/imgs/imgBckg-Small_Over.png) no-repeat 0 0');
  });

  $this.mouseleave(function(){
    $this.css('background', 'url(Assets/imgs/imgBckg-Small.png) no-repeat 0 0');
  });

});