背景图像在chrome中不起作用

时间:2012-06-10 14:03:14

标签: jquery css firefox google-chrome

  .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。请帮帮我

1 个答案:

答案 0 :(得分:2)

代码似乎很好,所以没有任何错误,可能是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
});