IE加载指标和链接与图像

Question

这是一个在IE8-9中加载指示器的奇怪行为的例子(它在一个标签上)

http://afternoon -河- 5822. herokuapp.com/

有两个链接:第一个打开一个"快"的页面，另一个打开一个"慢"的页面，好像有一些计算在上面。大约20秒后打开。

这些链接有两个图像。第一个用于默认状态，第二个用于突出显示。

问题是:如果在IE8-9中点击"慢"链接并将鼠标从链接上移开，那么IE将停止进度-选项卡上的旋转器将消失。大约20秒后会显示一个新页面。但是，如果点击链接后不触摸鼠标(图像将不会被更改为默认值)，那么指示器将正常工作-将旋转，直到一个新的页面完全加载。

我怎样才能避免这种行为?

CSS:

.b-mainmenu li {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  min-width: 58px;
  height: 100px;
  margin-right: -6px;
}
.b-mainmenu li a {
  display: block;
  font: bold 11px "Lucida Grande",tahoma,arial,sans-serif;
  color: #5d5e5b;
  min-width: 58px;
  padding-top: 36px;
  background-position: 50% 3px;
  background-repeat: no-repeat;
  margin-right: 3px;
  margin-left: 3px;
}
.b-mainmenu li a:hover, 
.b-mainmenu li.active a {
  text-decoration: none;
  color: #fff;
}
a {
  display: block; width: 341px; height: 97px;
}
.b-mainmenu-fast {
  background-image: url(/assets/menu-home.png);
}
.b-mainmenu-slow {
  background-image: url(/assets/menu-backup.png);
}
.b-mainmenu-fast:hover {
  background-image: url(/assets/menu-home_aa.png);
}
.b-mainmenu-slow:hover {
  background-image: url(/assets/menu-backup_aa.png);
}

HTML:

<ul class="b-mainmenu">
<li><a class="b-mainmenu-fast" href="page/fast_page">Fast page</a></li>
<li><a class="b-mainmenu-slow" href="page/slow_page">Slow page</a></li>
</ul>

Answer 1

也许你可以避免改变URL相关的属性悬停?通过设置background-color等属性，可以达到理想的视觉效果。没有URL更改，负载指示器将工作良好。我已经检查了数据url是否会产生任何差异-不幸的是没有。

您期望加载新页面将花费很多时间，在这种情况下，我建议显示一些进度指示器，而不是过多地关心选项卡上的内置旋转器。