Question

我有一个“隐藏物品”游戏，你点击的热点然后显示你找到了对象。除了IE8之外，它在所有浏览器中运行良好，我无法找出原因。

热点位于DIV，使用CSS设置：

 .hotspot {
  background-color: none;
  position: absolute;
}

#hs1 {
  width: 40px;
  height: 80px;
  top: 50px;
  left: 200px;
}

然后是2，等等。有一个JQuery可以通过点击“完成”类来交换这个类：

.done {
  background-color: #ffff00;
  border: 1px solid #ff0000;
}

Jquery是

$('#hs1').click(function(){
        $('#textPanel .title').text("CORRECT!");
        $('#textPanel .body').text("blah blah");
        $(this).addClass('done');
        itemsLeft--;
        updateItemsLeft();
    });

正如我所说，这一切都适用于其他浏览器。问题似乎源于background-color:none - 如果我将初始样式更改为background-color: #ccc，它可以正常工作（但隐藏的点不会隐藏......）

我被问到了什么建议？

Answer 1

我想none中没有background-color的值。尝试给background-color: transparent;并查看。我想这可能会奏效！

这是IE的已知错误。当你开始时，$(document).ready()在页面加载到IE后隐藏代码：

$(document).ready(function(){
    $('#hs1').css('background-color', '#fff');
    $('#hs2').css('background-color', '#fff');
    $('#hs3').css('background-color', '#fff');
    $('#hs4').css('background-color', '#fff');
});

如果这不起作用，请在CSS中添加!important：

.done {
  background-color: #ffff00 !important;
  border: 1px solid #ff0000;
}

希望这有帮助！：）

Jquery单击以显示无法在Internet Explorer中工作的不可见div（添加类）？

1 个答案: