大家帮我看下JS 标示导航条有个地方错了


<!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>
<style type="text/css"> #head { 
width:960px; 
height:35px; 
background-image:url(gps.jpg);
list-style:none;} #head a{ 
color:#FFF;
text-decoration:none; 
font-size:14px; 
line-height:35px; 
width:60px;
height:35px;
display:block;
float:left;
text-align:center;
margin-left:10px;
margin-right:10px;
}

#head a:hover{
background-image:url(gps2.jpg);
border:none;}

</style>
<script type="text/jscript">
function fun(vent) 
{ 
    var ancolor="url(gps2.jpg)";
var bncolor="#000";
var len;
var arryName=document.getElementById("head").getElementsByTagName("a");
len=arryName.length;
for(var i=0;i<len;i++)
{
if(vent.id==document.getElementById("head").getElementsByTagName("a")[i].id)
{
arryName[i].style.background-image="url(gps2.jpg)"; }
else
{
arryName[i].style.background=bncolor;
}
}
} 
</script> </head><body>
<div id="head">
    <li>
    <a href="#" onclick="fun(this)">首页</a>
    <a href="#" onclick="fun(this)">新片</a>
    <a href="#" onclick="fun(this)">大片</a>
    <a href="#" onclick="fun(this)">排行榜</a>
    <a href="#" onclick="fun(this)"> 首播</a> 
    <a href="#" onclick="fun(this)">分类浏览</a>
    <a href="#" onclick="fun(this)"> 专题</a>
    <a href="#" onclick="fun(this)">影视中心</a>
    </li>
</div>
</body>
</html>红色部分.  我用颜色来替换背景可以成功 但是用背景图片确不行. 提示有错误....不知道怎么改。
大家帮我看看吧

解决方案 »

  1.   

    这一句应该怎么改？
    arryName[i].style.background-image="url(gps2.jpg)";
    大家帮我看看吧。 不怎么会写！！
      

  2.   

    arryName[i].style.backgroundImage = "url(gps2.jpg)"; 
      

  3.   

    2楼的大哥 我按你的方法改了下。 图片是出来了
    怎么 一出来就全出来了 是不是JS代码哪里写错了？<script type="text/jscript">function fun(vent)
    { var arryName=document.getElementById("head").getElementsByTagName("a");
    len=arryName.length;
    for(var i=0;i<len;i++)
    {
    if(vent.id==document.getElementById("head").getElementsByTagName("a")[i].id)
    {
    arryName[i].style.backgroundImage="url(gps2.jpg)";
    }
    else
    {
    arryName[i].style.backgroundImage="url(gps3.jpg)";
    }
    }

    }
    </script> </head><body>
    <div id="head">
        <li>
        <a href="#" onclick="fun(this)">首页</a>
        <a href="#" onclick="fun(this)">新片</a>
        <a href="#" onclick="fun(this)">大片</a>
        <a href="#" onclick="fun(this)">排行榜</a>
        <a href="#" onclick="fun(this)"> 首播</a> 
        <a href="#" onclick="fun(this)">分类浏览</a>
        <a href="#" onclick="fun(this)"> 专题</a>
        <a href="#" onclick="fun(this)">影视中心</a>
        </li>
    </div>
      

  4.   


    <script type="text/jscript">function fun(vent)
    {    var arryName=document.getElementById("head").getElementsByTagName("a");
        len=arryName.length;
        for(var i=0;i<len;i++)
        {
            if(vent.id==document.getElementById("head").getElementsByTagName("a")[i].id)
            {
                arryName[i].style.backgroundImage="url(gps2.jpg)";
            }
            else
            {
                arryName[i].style.backgroundImage="url(gps3.jpg)";
            }
        }
        
    }
    </script> </head><body>
    <div id="head">
        <li>
        <a id="a0" href="#" onclick="fun(this)">首页</a>
        <a id="a1" href="#" onclick="fun(this)">新片</a>
        <a id="a2" href="#" onclick="fun(this)">大片</a>
        <a id="a3" href="#" onclick="fun(this)">排行榜</a>
        <a id="a4" href="#" onclick="fun(this)"> 首播</a> 
        <a id="a5" href="#" onclick="fun(this)">分类浏览</a>
        <a id="a6" href="#" onclick="fun(this)"> 专题</a>
        <a id="a7" href="#" onclick="fun(this)">影视中心</a>
        </li>
    </div>