<!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>
@charset "utf-8";
body{ font:12px "宋体"; background:#fff; margin:0 ; padding:0 ;}
option{margin:0; padding:0;}
input{ margin:0px; padding:0px; }
dt,dl,dd,p,ul,li,form,img,p,strong{margin:0px; padding:0px; border:0;}
a{ color: #000; text-decoration: none; }
a:hover{ color:#B70505; text-decoration:underline;}
a:focus { outline:none;}
ul,li{list-style:none;}
.clear{clear:both;font-size:0px;height:0px;line-height:0px;overflow:hidden;}
#focus_img{ padding-left:25px; width:274px; float:left; padding-right:5px; border-right:1px solid #BFBFBF; margin-top:15px;}
.undis {DISPLAY: none}
#simg{ width:264px;}
#simg ul{}
#simg ul li{ width:68px; height:68px;border:1px solid #BDBCBD; margin-right:6px; margin-bottom:10px; margin-left:6px; CURSOR: pointer; padding:3px; background:#fff; float:left; display:inline;}
</style>
</head>
<body>            
<DIV id=focus_img>
      <DIV id=au style="WIDTH: 258px; height:259px; padding:3px; border:1px solid #BDBBBC; border-bottom:5px solid #0491B7;">
          <DIV class=dis name="f"><A href="#" target=_blank>1111 111111111 1111111</A></DIV>
          <DIV class=undis name="f"><A href="#" target=_blank>222 22222222222 222222</A></DIV>
          <DIV class=undis name="f"><A href="#" target=_blank>3333333 33333333 3333333</A></DIV>
          <DIV class=undis name="f"><A href="#" target=_blank>4444444 44444 444444</A></DIV>
          <DIV class=undis name="f"><A href="#" target=_blank>555555 55555 5555555 555555</A></DIV>
  </DIV>
     <div id="simg">
        <ul>
          <li class="s" onmouseover="play(this,'au','');"><A href="#">111111 1111111 1111111 111111</A></li>
          <li class="s" onmouseover="play(this,'au','');"><A href="#">22222222 22222222 22222</A></li>
          <li class="s" onmouseover="play(this,'au','');"><A href="#">333333 333333333 3333333</A></li>
          <li class="s" onmouseover="play(this,'au','');"><A href="#">444444 4444444444 444444444</A></li>
          <li class="s" onmouseover="play(this,'au','');"><A href="#">555555 5555555555 555555555555</A></li>
        </ul>
     </div>
</DIV>
    <SCRIPT language=JavaScript src="js/img.js" type=text/javascript >
    function getid(obj)//取对应id的元素
  {
return document.getElementById(obj);
  } function getNames(obj,name,tij)//取obj元素下标签为tij的元素并要求满足name属性=name;返回一个数组
{
var p = getid(obj);
var plist = p.getElementsByTagName(tij);
var rlist = new Array();
for(i=0;i<plist.length;i++)
{
if(plist[i].getAttribute("name") == name)
{
rlist[rlist.length] = plist[i];
}
}
return rlist;
} function ri(obj)//取得对应的小图列表中当前元素对应的序号
{
var p = getid("simg").getElementsByTagName("li");
for(i=0;i<p.length;i++)
{
if(obj == p[i])
{
return i;
}
}
} function ci(obj)//小图选择框的处理函数
{
var p = getid("simg").getElementsByTagName("li");
for(i=0;i<p.length;i++)
{
if(obj ==p[i])
{
p[i].className ="s";
}
else
{
p[i].className ="";
}
}
}
function fiterplay(obj,num,t,name)//类似页卡的函数.设置对应内容的隐藏和显示 obj:元素的id  name:元素对应的name属性的值, t:对应内容的标签 num:当前选择的元素的序号
{
var fitlist = getNames(obj,name,t);
for(i=0;i<fitlist.length;i++)
{ if(i == num)
{
fitlist[i].className = "dis";
}
else
{
fitlist[i].className = "undis";
}
}
}
  
  
function play(obj,n1)//播放的函数
{
var p = obj.parentNode.parentNode.getElementsByTagName("img");
var au = getid(n1);
var num = ri(obj);
try //ie下的处理部分
{
with(au)
{
filters[0].Apply(); //接收滤镜
ci(obj); //变幻小图的选择.可以放在try以外.
fiterplay(n1,num,"div","f");//设置滤镜中对应部分的显示和隐藏
filters[0].play(); //播放滤镜
}
}
catch(e)//ff下的处理部分
{
ci(obj);
fiterplay(n1,num,"div","f");
}
}
var n=0;
function clearAuto() {clearInterval(autoStart);};
function setAuto(){autoStart=setInterval("auto(n)", 4000)}
function auto()
{
var x = getid("simg").getElementsByTagName("li");
n++;
if(n>3)n=0;
play(x[n],"au");
}
 
    </SCRIPT>  </body>
</html>

解决方案 »

  1.   

    在IE6中总是提示错误,且强行运行的时候JS不可用.
      

  2.   

    function play(obj,n1)//播放的函数
    {
    var p = obj.parentNode.parentNode.getElementsByTagName("img");
    var au = getid(n1);
    var num = ri(obj);
    try //ie下的处理部分
    var p = obj.parentNode.parentNode.getElementsByTagName("img");?????
      

  3.   

    后面本来是图片,但是为了在这里显示的效果更好,所以我把图片去掉了,换成了数字,并没有影响到JS的使用,你可以在IE6里测试测试...