0

当鼠标悬停时,我需要在另一个图像上显示和图像,这是一种菜单。这适用于 chrome 和 firefox。任何想法?来了

<div id="button1OverStyle" class="buttonOverStyle" onclick="changeFrame('main/main.html')" >
<img id="button1OverStyleImage" src="images/button_home.png" height="24" width="46" />

<script>      
  $('#button1OverStyle').hover(function(e) {
    showTittle('button1OverStyleImage');  });
  $('#button1OverStyle').mouseleave(function(e) {
    hideTittle('button1OverStyleImage');});
  $('#button2OverStyle').mouseover(function(e) {
    showTittle('button2OverStyleImage'); });
  $('#button2OverStyle').mouseleave(function(e) {
    hideTittle('button2OverStyleImage'); });      
</script>

我找到了在哪里找到它。这就是问题所在

在这一行

<div id="button1OverStyle" class="buttonOverStyle" onclick="changeFrame('main/main.html')" >
            <img id="button1OverStyleImage" src="images/button_home.png" height="24" width="46" />
        </div>

这是CSS

.buttonOverStyle{   position:absolute;  cursor:pointer;     z-index:1000;   height:24px;}  .buttonOverStyle img {   display:none;}

问题是,如果图像不显示,Internet Explorer 无法识别 div,因此无法进行“mouseenter”或“mouseover”。

任何想法??????

4

2 回答 2

1

尝试mouseenter

mouseenter JavaScript 事件是 Internet Explorer 专有的。由于事件的通用性,jQuery 模拟了这个事件,因此无论浏览器如何都可以使用它。当鼠标指针进入元素时,该事件被发送到元素。任何 HTML 元素都可以接收此事件。

HTML

<div>test</div>​

jQuery

$("div").mouseenter(function(){
    $(this).css("color", "red");
});
$("div").mouseleave(function(){
    $(this).css("color", "blue");
});

例子

你也可以试试.hover()

于 2012-10-08T18:30:15.997 回答
1

解决方案!

我用 Css 做这一切,但不透明

.buttonOverStyle img {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
filter: alpha(opacity=10);
opacity: .1;}


.buttonOverStyle img:hover {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=90);
opacity: .9;}

这对我有用

于 2012-10-16T21:10:50.323 回答