实现flash的图片切换效果【可以切换多个网页或者图片】

这个是得到改进后的代码，可以切换多个页面
需要完整代码的朋友可以留下email
如需再添加切换页面，只要按照下边代码部分的样式添加内容即可
切换导航td的id要顺序排
那个div的TOP为为上边一个div的Top加上div本身的高度：237

  1 <% @ Page Language = " C# "  AutoEventWireup = " true "  CodeFile = " Service.aspx.cs "  Inherits = " Service "   %>
  2
  3 <! DOCTYPE html PUBLIC  " -//W3C//DTD XHTML 1.0 Transitional//EN "   " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
  4
  5 < html xmlns = " http://www.w3.org/1999/xhtml "   >
  6 < head runat = " server " >
  7      < title > 我们的服务 < / title>
  8      < link href = " Themes/default/css.css "  rel = " stylesheet "  type = " text/css "   / >
  9          < meta content = " text/html; charset=gb2312 "  http - equiv = " Content-Type " >
 10      < style type = " text/css "   >
 11      <!--
 12     .tdBG
 13      {
 14        border: #cccccc 1px solid; 
 15        padding-right: 0px;
 16        padding-left: 0px; 
 17        padding-bottom: 5px; 
 18        padding-top: 5px; 
 19        background-color:#e6e6e6;
 20    }
 21       -->
 22      < / style>
 23 < / head>
 24 < body onload = " iniautoslide() " >
 25      < table align = " center "  cellpadding = " 0 "  cellspacing = " 0 "  width = " 100% " >
 26      < tr >
 27      < td style = " width:180px; " >
 28      < img src = " Images/mlogo.gif "  alt = ""  border = " 0 "  style = " width: 180px; height: 136px "   / >
 29      < / td>
 30      < td >
 31      < ul >
 32      < li > 进入市场的连锁通路 < / li>
 33          < li > 有效处理公司库存 < / li>
 34          < li > 新产品成功推广 < / li>
 35      < / ul>
 36      < / td>
 37      < / tr>
 38          < tr >
 39          < td colspan = " 2 "  class = " tdBG "  onmouseout = " iniautoslide(); "  onmouseover = " clearInterval(interval01); "
 40           >
 41          < div style = " width: 0px; position: relative; height: 0px " >
 42              < div style = " z-index: 10; " >
 43                  < table cellspacing = " 0 "  cellpadding = " 0 " >
 44                      < tbody >
 45                          < tr >
 46                              < td height = " 29 "  style = " padding-left: 1px "  width = " 24 " >
 47                                  < img id = " upbtn "  alt = " Last "  height = " 28 "  onclick = " slideup();clearInterval(interval01); "
 48                                     onfocus = " this.blur() "  src = " images/scrollad_left.gif "  style = " cursor: pointer "  width = " 24 " >< / td>
 49                              < td height = " 2 " >
 50                              < / td>
 51                              < td id = " led1 "  class = " NUM2 "  height = " 19 " >
 52                                 1 < / td>
 53                              < td height = " 2 " >
 54                              < / td>
 55                              < td id = " led2 "  class = " NUM1 "  height = " 19 " >
 56                                  2 < / td>
 57                              < td height = " 2 " >
 58                              < / td>
 59                              < td id = " led3 "  class = " NUM1 "  height = " 19 " >
 60                                  3 < / td>
 61                              <td id="led4" class="NUM1" height="19">
 62                                4</td>
 63                              < td height = " 3 " >
 64                              < / td>
 65                              < td height = " 29 "  style = " padding-left: 1px " >
 66                                  < img id = " downbtn "  alt = " Next "  height = " 29 "  onclick = " slidedown();clearInterval(interval01); "
 67                                     onfocus = " this.blur() "  src = " images/scrollad_right.gif "  style = " cursor: pointer "  width = " 24 " >< / td>
 68                          < / tr>
 69                      < / tbody>
 70                  < / table>
 71              < / div>
 72          < / div>
 73          < div id = " main "  nowrap = ""  style = " overflow: hidden; position: relative;
 74             height: 237px " >
 75              < div id = " f1 "  style = " z-index: 10; left: 0px;  position: absolute; top: 0px;
 76                 height: 237px " >
 77                  < iframe frameborder = " 0 "  height = " 250 "  marginheight = " 0 "  marginwidth = " 0 "  name = " frame1 "
 78                     noresize = ""  onload = " checkdamie(1) "  scrolling = " no "  src = " 01.htm "  width = " 100% " >< / iframe>
 79              < / div>
 80              < div id = " f2 "  style = " display: none; z-index: 10; left: 0px;  position: absolute;
 81                 top: 237px; height: 237px " >
 82                  < iframe frameborder = " 0 "  height = " 250 "  marginheight = " 0 "  marginwidth = " 0 "  name = " frame1 "
 83                     noresize = ""  onload = " checkdamie(2) "  scrolling = " no "  src = " 02.htm "  width = " 100% " >< / iframe>
 84              < / div>
 85              < div id = " f3 "  style = " display: none; z-index: 10; left: 0px;  position: absolute;
 86                 top: 474px; height: 237px " >
 87                  < iframe frameborder = " 0 "  height = " 250 "  marginheight = " 0 "  marginwidth = " 0 "  name = " frame1 "
 88                     noresize = ""  onload = " checkdamie(3) "  scrolling = " no "  src = " 03.htm "  width = " 100% " >< / iframe>
 89              < / div>
 90              <div id="f4" style="display: none; z-index: 10; left: 0px; position: absolute;
 91                top: 711px; height: 237px">
 92                <iframe frameborder="0" height="250" marginheight="0" marginwidth="0" name="frame1"
 93                    noresize="" οnlοad="checkdamie(4)" scrolling="no" src="04.htm" width="100%"></iframe>
 94            </div>
 95          < / div>
 96          < / td>
 97          < / tr>
 98      < / table>
 99
100   < script language = " JavaScript " >
101 <!--
102 var  currentF = 1 ;
103 document.getElementById( " upbtn " ).style.display = " none " ;
104 var  mainobj  =  document.getElementById( " main " );
105 var  count = (mainobj != null ) ? mainobj.children.length: 0 ;
106 // var count=4;
107 // alert(count);
108 var  frameheight  =   237 ;
109 var  scrolling = 0 ;
110 var  speed  =   20 ;
111 var  checkloaded = new  Array();
112 for (i = 1 ;i <= count;i ++ ) {
113checkloaded[i]=0;
114}
115 function  checkdamie(n) {
116    checkloaded[n]=1;
117    //alert(checkloaded[n])
118
119}
120 function  alertloading(sdirection) {
121scrolling=0;
122if(sdirection == "down"){
123currentF--;
124}
125else{
126currentF++;
127}
128//alert("正在下载数据,请稍等");
129}
130
131 function  scrolldown(f) {
132
133    if(f>1 && f<count)
134    {    //case 2:
135        if (mainobj.scrollTop>=(frameheight*(f-1)))
136        {
137            clearInterval(inter);
138            mainobj.scrollTop=(frameheight*(f-1));
139            scrolling=0;
140        }
141        else
142        {
143        mainobj.scrollTop+=speed;
144        }
145    }
146
147    if(f==count)
148    {
149        if (mainobj.scrollTop>=frameheight*(count-1))
150        {
151            mainobj.scrollTop=frameheight*(count-1);
152            clearInterval(inter);
153            scrolling=0;
154        }
155        else{mainobj.scrollTop+=speed;}
156    }
157}
158
159
160 function  scrollup(f) {
161
162    if (f<count){
163    if (mainobj.scrollTop<=(frameheight*(f-1))){
164        clearInterval(inter1);
165        mainobj.scrollTop=(frameheight*(f-1));
166        scrolling=0;
167        }
168    else{
169    mainobj.scrollTop-=speed;
170    }
171    }
172
173    if(f==count)
174    if (mainobj.scrollTop<=(frameheight(count-1))){
175        mainobj.scrollTop=(frameheight(count-1));
176        clearInterval(inter1);
177        scrolling=0;
178        }
179    else{
180    mainobj.scrollTop-=speed;
181    }
182}
183
184 function  slidedown() {
185    //slide
186if (scrolling==0){
187    scrolling=1;
188    currentF++;
189    obj=eval("document.getElementById('f"+currentF+"')");
190    obj.style.display="block";
191    if (checkloaded[currentF]==1){
192        inter=eval("setInterval('scrolldown("+currentF+")',5)");
193        //led
194        document.getElementById("upbtn").style.display="";
195        if (currentF==(count)){
196        document.getElementById("downbtn").style.display="none";
197        }
198        for (i=1;i<=count;i++)
199        {
200            var tpobj=eval("document.getElementById('led"+i+"')");
201            if(i==currentF)
202                tpobj.className='NUM2';
203            else
204                tpobj.className=(tpobj.className=='NUM2')?'NUM1':tpobj.className;
205        }
206    }
207    else{
208    alertloading("down");
209    
210    }
211    }
212}
213
214
215 function  slideup() {
216    //slide
217if (scrolling==0)
218{
219    scrolling=1;
220    currentF--;
221    obj=eval("document.getElementById('f"+currentF+"')");
222    obj.style.display="block";
223        if (checkloaded[currentF]==1){
224        inter1=eval("setInterval('scrollup("+currentF+")',5)");
225        //led
226        document.getElementById("downbtn").style.display="";
227        if (currentF==1){
228        document.getElementById("upbtn").style.display="none";
229        }
230        for (i=1;i<=count;i++)
231        {
232            if(i==currentF)
233                eval("document.getElementById('led"+currentF+"').className='NUM2'");
234            else
235                eval("document.getElementById('led"+i+"').className='NUM1'");
236        }
237        }
238        else{
239        alertloading("up");
240        }
241    }
242}
243 // auto slide
244 var  direction  =   " down " ;
245 var  interval01;
246 var  autotime  =   3000 ;
247 function  autoslide() {
248    if(direction == "down"){
249        if (currentF == (count-1)){
250         direction = "up";
251        }
252    slidedown();
253    }
254    if(direction == "up"){
255        if (currentF == 2){
256         direction = "down";
257        }
258    slideup();
259    }
260    
261}
262 function  iniautoslide() {
263interval01 = setInterval("autoslide()",autotime);
264}
265
266 // -->
267   < / script>
268
269 < / body>
270 < / html>
271

转载于:https://www.cnblogs.com/neilvension/archive/2008/03/02/1088164.html