点击一个文字,弹出一个层,鼠标就在这个层里面,并且这个层设置了onmouseover改变背景颜色的事件,因为点击后鼠标处于静止状态,所以层的onmouseover事件没有触发背景没变,在ie里面是这样,但在FF里就可以触发,请问这是什么原因。

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head>
    <style>
    body{ padding:0; margin:0;}
    .pages{ position:relative;}
    .back{ width:60px; height:25px;}
    .tenpage{ width:85px; height:25px; padding:7px 0 0 0;}
    .tenpage:hover{ background:url(img/txt_bg_12.gif) no-repeat;}
    #tenpage{ cursor:pointer; position:relative;}
    #tenpage1{ cursor:pointer;}
    .pagemenu{ position:absolute; width:60px; border:1px #336699 solid; background:#fff; left:0; top:0px; display:none; z-index:10;}
    #newslist .item:hover{ background:#e3ecf3;}
    a.pagemenu_a:link,a.pagemenu_a:visited{ display:block; line-height:25px;}
    a.pagemenu_a:hover{ background:#e3ecf3; color:#FF0000; line-height:25px;}
    a.nextpage_default:link,a.nextpage_default:visited{ display:block; height:25px; width:25px; background:url(img/arrow_right_default.gif);}
    a.nextpage_default:hover{ display:block; height:25px; width:25px; background:url(img/arrow_right_on.gif);}
    a.nextpage_no:link,a.nextpage_no:visited{ display:block; height:25px; width:25px; background:url(img/arrow_right_no.gif);}
    a.nextpage_no:hover{ display:block; height:25px; width:25px; background:url(img/arrow_right_no.gif); cursor:default;}a.backpage_default:link,a.backpage_default:visited{ height:25px; width:25px; background:url(img/arrow_left_default.gif);}
    a.backpage_default:hover{ display:block; height:25px; width:25px; background:url(img/arrow_left_on.gif);}
    a.backpage_no:link,a.backpage_no:visited{ display:block; height:25px; width:25px; background:url(img/arrow_left_no.gif);}
    a.backpage_no:hover{ display:block; height:25px; width:25px; background:url(img/arrow_left_no.gif); cursor:default;}</style>
    <body>
    <div class="pages">
    <div class="right tenpage"><span id="tenpage">11/666</span></div>
    <div class="pagemenu" id="pagemenu" style="display:none;"><a href="javascript:void(0)" class="pagemenu_a">1</a><a href="javascript:void(0)" class="pagemenu_a">1</a><a href="javascript:void(0)" class="pagemenu_a">1</a><a href="javascript:void(0)" class="pagemenu_a">1</a></div>
    </div>
    <script>
    var pagemenu=document.getElementById("pagemenu");
    var tenpage=document.getElementById("tenpage");
    function addListener(obj,action,func){
         if(obj.addEventListener){
              obj.addEventListener(action,func,false);
         } else {
              obj.attachEvent("on" + action,func);
         }
    }
    function displaymenu(obj)
    {
      if(obj.style.display=="block")
      {
        obj.style.display="none";
      }
      else
      {
    obj.style.display="block";
    setTimeout("change_position('"+obj.id+"')",500);
      }
    }function change_position(id)
    {
        //alert(id)
        obj=document.getElementById(id);
    obj.focus();
    }function menu(obj)
    {
      if(obj.style.display=="block")
      {
      var event=event || window.event;
      var posX=obj.offsetLeft-document.documentElement.scrollLeft;
      var posY=obj.offsetTop-document.documentElement.scrollTop;
      var x=event.clientX?event.clientX:event.x;
      var y=event.clientY?event.clientY:event.y;
      var width=obj.offsetWidth;
      var height=obj.offsetHeight;
      if(x<posX || x>(posX+width))
      {
    displaymenu(obj);

      }
      if(y<posY || y>(posY+height))
      {
    displaymenu(obj);
      }
      }
    }
    addListener(document.body,"mousemove",function(){menu(pagemenu)});
    addListener(tenpage,"click",function(){displaymenu(pagemenu)})
    </script>
    </body>
    </html>