背景图像在chrome中不起作用

Question

  .button {
        background: transparent url("/assets/LoD-Button-Normal.png") no-repeat bottom right;
        width: 110px;
        height: 30px;
        display: block;
        background-position: bottom right; 
        text-align:center;
    }

    .button_click { 
      background: transparent url("/assets/LoD-Button-Click.png") no-repeat bottom right;
      width: 110px;
      height: 30px;
      display: block;
      background-position: bottom right;
    }

    $(".button").click(function(){
      $(this).removeClass("button").addClass("button_click");   
    })

    <a class="button" href="/link"> Button </a>

当我点击按钮时。它改变了Firefox上的背景图像，但它不适用于chrome。请帮帮我

Answer 1

代码似乎很好，所以没有任何错误，可能是chrome在更改bg图像之前重定向。

试试这个：

$(".button").click(function(e){
  e.preventDefault();
  $(this).removeClass("button").addClass("button_click");
  location.href = $(this).attr('href'); 
  // if for some reason this isn't working you can call setTimeout with the location.href
});