模仿网易新闻的首页特效

　　网易新闻的首页特效很好看，上个星期做网页专题写了个特效结果不理想，今天上午就想模仿网易新闻的效果，下午开始动手到晚上终于搞定了。

　　实现效果：

1、正常情况下，图片和文字内容轮动；可以修改ContentN.Html(N=1~6)文件里面的内容；

2、鼠标移入大图，轮动停止，可以点击向左或者向右进行浏览，也可以点击具体的小图片进行浏览；

3、小图片和左右按钮式半透明，可以随意设置焦点的图片样式；

4、可以随意将效果移置到其他网页中。

　　下面是代码：

仿网易首页的动画

 body           {text-align:center;
   topmargin:0;
   leftmargin:0;
   background:yellow;}
        #dawn0919      {position:relative;
   text-align:center;
   topmargin:0;
   leftmargin:0;
   background:red;
   width:1024;
   height:500;
   border:0;
   overflow:hidden;
   z-index:1;}
        #dawn0718      {position:absolute;
   left:464;
                        top:0;
   text-align:center;
   topmargin:0;
   leftmargin:0;
   width:560px;
   height:280px;
   border:0;
   background:blue;
   overflow:hidden;
   z-index:2}

        #Content0      {position:absolute;
                        left:0;
   z-index:3
                        }
        #Content1      {position:absolute;
                        left:560;
   z-index:4
                        }
        #Content2      {position:absolute;
                        left:1120;
   z-index:5
                        }
        #Content3      {position:absolute;
                        left:1680;
   z-index:6
                        }
        #Content4      {position:absolute;
                        left:2240;
   z-index:7
                        }
        #Content5      {position:absolute;
                        left:2800;
   z-index:8
                       }

 #MidBtn        {position:absolute;
                 width:400;
                 height:50;
   top:108;
   left:0;
   z-index:718;
   filter:alpha(opacity=70);
                 }
 #LeftBtn        {position:absolute;
   top:0;
   left:18;
   z-index:719;
   filter:alpha(opacity=60);
                 }

 #RightBtn       {position:absolute;
   top:0;
   left:342;
   z-index:780;
                 }

 #BottomPicBtn  {position:absolute;
                 width:400;
                 height:50;
   top:228;
   left:0;
   z-index:9999;
   filter:alpha(opacity=70);
                 }
 #SmallPic0      {position:absolute;
                         width:59;
    height:42;
    top:2;
    Left:12;
    border-width:0;
   margin:2px 2px auto;
    }
 #SmallPic1      {position:absolute;
    width:59;
    height:42;
                         top:2;
    Left:76;
    border-width:0;
   margin:2px 2px auto;
   }
 #SmallPic2      {position:absolute;
                         width:59;
    height:42;
   top:2;
   Left:140;
   border-width:0;
   margin:2px 2px auto;
   }
 #SmallPic3      {position:absolute;
                         width:59;
    height:42;
   top:2;
   Left:204;
   border-width:0;
   margin:2px 2px auto;
   }
 #SmallPic4      {position:absolute;
                         width:59;
    height:42;
   top:2;
   Left:268;
   border-width:0;
   margin:2px 2px auto;
   }
 #SmallPic5      {position:absolute;
                         width:59;
    height:42;
   top:2;
   Left:332;
   border-width:0;
   margin:2px 2px auto;
   }
        .PicFocus      {position:absolute;
                        margin:2px 2px 2px 2px;
                        border-width:4;
   border-style:solid;
   border-color:white;
   background:white;
   }
  




 var ScrollStr;
 var ScrollWidth=560;
 var ScrollNumBers=6;
 var TimerID;
        var ActionFlag=0;

 function init(){
     ScrollStr="012345";
         ReadyDiv();
  HideBottomPicBtn();
        }

        function ReadyDiv(){
         for(var i=0;i