0

我是自学 JQuery 并且遇到了一些障碍。我所做的是在图像上分层一个 div，将可见性设置为隐藏，并使用 JQuery 声明当我鼠标进入图像时，框是可见的，当我鼠标离开时，框消失。这适用于 Firefox，但在 IE 中，当我将鼠标悬停时，只有单词出现，并且当鼠标离开 div 时它们不会消失。

我知道这个问题已经以多种形式提出，但到目前为止我的研究还没有提供一个可行的答案。我将不胜感激一些建议。

我的 HTML：

<table>
<td class=presentation>
<a href="Capabilities-PDF.html" target="_blank"> <div class="cover hidden1"> Learn About Us </div> </a>
<div class="image1"><img
  title="Capabilities"
  alt="Capabilities"
  src="images/thumbnails/Capabilities.png"
class="img"></div></td>
</table>
</body>

我的JavaScript：

$(document).ready(function(){
$('.image1').mouseover(function(){
    $('.hidden1').show();
    });
$('.hidden1').mouseout(function(){
    $(this).hide();
});

我的 CSS：

.cover{
background-color: rgba(0, 0, 0, 0.7);
height: 131px;
position: absolute;
width: 175px;
z-index: 1;
text-align: center;
color: ffffff;
font-weight: bold;
text-decoration: none;

}

.hidden1 {
display: none;
}
.image1 {
height: 131px;
width: 175px;
overflow: hidden;
}
4

0 回答 0