为什么js里面对样式的更改只在ie9上面有反应，在其他浏览器都没反应？？？

<!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=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function change(event){
document.getElementById("box1").style.background="url(1.gif) no-repeat;";
document.getElementById("dd").style.background="none;";
}
function changes(event){
document.getElementById("box1").style.background="none;";
document.getElementById("dd").style.background="url(1-bg.png) no-repeat;";
}
</script>
<style type="text/css">
img{ border:0px;}
.main{ width:956px; height:340px; margin-top:15px; }
#box1{ width:230px;height:340px; margin-left:10px;}
.con{ background-image:url(1.gif); background-repeat: no-repeat;}
.b { width:222px; height:227px;background:url(1-bg.png) no-repeat;margin-top:10px; margin-left:5px;
position:relative; top:4px;}
.b img{ margin-top:6px; margin-left:5px;}
#box1 p{font:"宋体"; font-size:12px;margin:0px; padding:0px; padding-left:10px; padding-right:8px;margin-top:10px;}
#box1 p a{color:#3366cc; line-height:20px; text-decoration:none;}
#box1 p a:hover{color:#3366cc; line-height:20px; text-decoration:underline;}
#box1 .c{ width:110px; float:left;}
.style11{ color:#ff3300; margin-left:5px; margin-right:5px; font-weight:bold;}
.style21{ color:#3366cc; margin-left:4px; margin-right:4px; }
#box1 .d{ width:80px; float:right;}
#box1 .e{width:67px; height:23px; float:right; margin-right:10px; margin-top:5px;}
#box1 .e a{ display:block;font:"宋体"; font-size:12px; color:#FFFFFF;width:67px; height:23px; background-image:url(21.gif); background-repeat:no-repeat; text-decoration:none; line-height:25px; text-indent:10px;}
#box1 .e a:hover{ background-image:url(2.png); background-repeat:no-repeat;}
.style31{ color:#4fb000; margin-right:4px; font-weight:bold;}
</style>
</head><body>
<div class="main">
  <div id="box1" onmousemove="change(event)" onmouseout="changes(event)">
    <div class="b" id="dd"><a href="#"><img src="16.png" /></a></div>
     <p><a href="#">佐卡伊18K金钻戒结婚戒指钻石女戒指1克拉直径主石10副石10分</a></p>
      <div class="c"><p>共<span class="style11">32654</span>人参加</p>
                     <p>由<span class="style21"><a href="#">戴尔中国</a></span>主办</p>
      </div>
      <div class="d"><p><span class="style31">2</span>天后结束</p></div>
      <div class="e"><a href="#">我要参加</a></div>
  </div>
</div>
</body>
</html>

解决方案 »

  1.   

    <script type="text/javascript">
    function change(event){
    document.getElementById("box1").style.backgroundImage="url(1.gif) no-repeat;";
    document.getElementById("dd").style.background="none;";
    }
    function changes(event){
    document.getElementById("box1").style.background="none;";
    document.getElementById("dd").style.backgroundImage="url(1-bg.png) no-repeat;";
    }
    </script>这样试试~·
      

  2.   

     <div id="box1" onmouseover="change(event)" onmouseout="changes(event)">
    over 写错了 我估计你的是拼写错误