Question

在此页面上：http://mrwgrp.com/index.php 当您翻转标题中的图像时，您将获得下面的图像。客户希望原始文本在鼠标离开后返回到屏幕上。

此外，IE甚至没有显示鼠标悬停。

有什么想法吗？谢谢，甲

Answer 1

DOM节点通常必须具有一些可见内容，否则某些IE将无法正确触发鼠标事件。使“虚拟”鼠标悬停区域与IE一起工作的一种方法是给它们1％可见的背景颜色，这不是很明显，但IE会触发事件。

此规则应适用于阻止IE忽略鼠标事件：

#pic1, #pic2, #pic3, #pic4 {
  background-color: #fff;
  opacity: 0.01;
  filter: alpha(opacity=01);
}

至于将原始文本重新显示在屏幕上，您是否需要添加其他事件？目前看起来你已经为“onmouseover”设置了一些东西，但没有别的。

Answer 2

如果mouseover为空，IE似乎没有检测到DIV。如果您为background-color，#pic1，#pic2和#pic3设置了#pic4，那么它可以正常运行（但可以胜过这种情况）。

使用image-map可能会更好地完成您要实现的目标。它支持onmouseover事件，因此您可以使用相同的代码进行图像交换。

Answer 3

试试这个

在页面重新加载后，将主页内容存储在JavaScript变量中;

<body onload="MM_preloadImages('images/re_ovr.gif','images/rev_ovr.gif','images/env_ovr.gif','images/contact_ovr.gif'); MM_storeHomePageText();">

添加mouseout代码以恢复原始文本;

<div id="pic1" onmouseover="MM_setTextOfLayer('homeText','','<h3>Linda Vista Redevelopment</h3>\n\n<p><img src="images/linda-vista.jpg" /></p>\n\n<p></p>')" onmouseout=MM_restoreHomePageText();> </div>

请注意Div中的 ，让我们知道这可以解决您的IE问题

var homePageText = '';
function MM_storeHomePageText() {
    homePageText = document.getElementById('homeText').innerHTML;
}
function MM_restoreHomePageText() {
    document.getElementById('homeText').innerHTML = homePageText;
}
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_setTextOfLayer(objId,x,newText) { //v9.0
  with (document) if (getElementById && ((obj=getElementById(objId))!=null))
    with (obj) innerHTML = unescape(newText);
}

鼠标悬停不会回到原始状态，IE根本没有显示它

3 个答案: