藍森林首頁 | 返回主頁 | 本站地圖 | 站內搜索 | 聯繫信箱 |
 您目前的位置:首頁 > 自由軟件 > 技術交流 > 應用編程


    

藍森林 http://www.lslnet.com 2006年8月25日 8:28

請教:如何實現文字的定時滾動啊?

具體效果如:http://www.manbu.net 左面的新聞效果!

[html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<TITLE>::漫步 Http://www.manbu.net/::</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
<link rel="shortcut icon" href="http://www.manbu.net/images/manbu.ico">
<link href="style/style.css" rel="stylesheet" type="text/css">
<script src="Scripts/fadeTicker.js" type="text/javascript"></script>
<script type="text/javascript">

function initFadeTicker()
{
        popupLoad.style.visibility='hidden'  //隱藏提示窗口

        se = new fadeTicker();
se.addItem("<span style='color:#6F2BD5' title='漫步計劃推出Sql版統計系統(見內)'>漫步計劃推出Sql版統計系統(見內)</span><br><font color=#cccccc>(2004年4月5日)</font>","# onclick=window.open('News/File/Show.asp?News_Id=3','','height=400,width=500,resizable=yes,scrollbars=yes')");
se.addItem("<span style='color:#1A94E6' title='網站現有欄目'>網站現在還很簡陋,目前只有論壇這個欄目,其他欄目會慢慢製作完成,希望大家能繼續支持!謝謝!:)</span><br><font color=#cccccc>(2004年3月20日)</font>","#");
se.addItem("<span style='color:#FF6600' title='改版完成'>網站改版完成,希望大家喜歡還請大家繼續支持漫步:)謝謝!</span><br><font color=#cccccc>(2004年3月19日)</font>","#");

        se.init(
                        2, // set the speed
                        4, // set the delay (how long each message is viewable) (seconds)
                        '' // set the target (optional)
                );
       

}
onload = initFadeTicker
</script>
</HEAD>
<BODY BGCOLOR=#FFFFFF>
<div name="loadpop" id="popupLoad" class="divcenter">

  <table width="200" border="0" cellspacing="0" cellpadding="5" class=popload>
        <tr>
          <td class=body align=center><b>正在讀取頁面內容.<br>請等待...</b></td>
        </tr>
  </table>

</div>
<TABLE WIDTH=778 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>
  <TR>
    <TD COLSPAN=2> <IMG SRC="images/ManbuPages_bak_1.gif" ALT="" WIDTH=778 HEIGHT=58 border="0" usemap="#Map"></TD>
  </TR>
  <TR>
    <TD COLSPAN=2> <IMG SRC="images/ManbuPages_bak_2.gif" WIDTH=778 HEIGHT=48 ALT=""></TD>
  </TR>
  <TR>
    <TD COLSPAN=2> <IMG SRC="images/ManbuPages_bak_3.gif" WIDTH=778 HEIGHT=21 ALT=""></TD>
  </TR>
</TABLE>
<TABLE WIDTH=778 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>
        <TR>
          <TD width="196" align="center" valign="top" bgcolor="#FFFFFF"><TABLE WIDTH=196 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>
        <TR>
          <TD height="40"> <IMG SRC="images/ManbuPages_bak_4.gif" WIDTH=196 HEIGHT=40 ALT=""></TD>
        </TR>
        <TR>
          <TD height="113" align="center" background="images/ManbuPages_bak_6.gif"><table width="83%" height="113"  border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td valign="top">
<div style='float:left;width:100%'>        <div id='tickBox'>                <div id='tickCont'></div>        </div></div>
                                </td>
              </tr>
          </table></TD>
        </TR>
        <TR>
          <TD height="6"> <IMG SRC="images/ManbuPages_bak_7.gif" WIDTH=196 HEIGHT=6 ALT=""></TD>
        </TR>
        <TR>
          <TD height="45"> <IMG SRC="images/ManbuPages_bak_8.gif" WIDTH=196 HEIGHT=45 ALT=""></TD>
        </TR>
        <TR>
          <TD height="91" align="center" bgcolor="#FFFFFF">
            <table width="85%"  border="0" cellspacing="0" cellpadding="4">
              <form name="form1" method="post" action="">
                <tr>
                  <td width="44%"><img src="images/use.gif" width="63" height="23"></td>
                  <td width="56%"><input name="textfield" type="text" class="sInput" size="12"></td>
                </tr>
                <tr>
                  <td><img src="images/pass.gif" width="63" height="23"></td>
                  <td><input name="textfield2" type="password" class="sInput" size="12"></td>
                </tr>
                <tr align="center">
                  <td height="29" colspan="2"><input name="Reg" type="button" class="button" id="Reg" value="註冊">
&nbsp;
              <input name="Submit" type="submit" class="button" id="Submit" value="登陸"></td>
                </tr>
              </form>
          </table></TD>
        </TR>
        <TR>
          <TD height="11"> <IMG SRC="images/ManbuPages_bak_10.gif" WIDTH=196 HEIGHT=11 ALT=""></TD>
        </TR>
        <TR>
          <TD align="center" valign="top" bgcolor="#FFFFFF">
            <table width="85%"  border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td height="190"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="190" height="190">
  <param name="movie" value="ballot.swf">
  <param name="quality" value="high">
   <param name="menu" value="false">
        <!--隱藏flash的右鍵菜單-->
   <param name="wmode" value="transparent">
        <!-設置flash為透明底-->
  <embed src="ballot.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="190" height="190"></embed>
</object></td>
              </tr>
          </table></TD>
        </TR>
      </TABLE></TD>
          <TD width="582" height="300" align="center" valign="top" bgcolor="#FFFFFF"><table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
          <tr>
            <td height="3"></td>
          </tr>
          <tr>
            <td height="1" background="images/free_line_bg.gif" ><img src="images/free_line_bg.gif"></td>
          </tr>
        </table>
                  <table width="95%"  border="0" cellspacing="0" cellpadding="0">
            <tr>
              <td width="24%" height="12"></td>
              <td width="76%"></td>
            </tr>
            <tr>
              <td><img src="images/Bz.gif" hspace="10" border="1"></td>
              <td valign="top"><p><strong>漫步的標誌</strong></p>
                <p>漫步的第一個標誌,希望能為漫步的發展打開一個好的開端,一年來磕磕碰碰走到今天,雖然一切看起來還是那麼的幼稚,但是有那麼多漫步的朋友支持者,相信會越來越好。您的支持是漫步發展的唯一動力。</p>
                <p>一年一晃眼就過去了,彷彿昨天,今天的漫步在大家的扶持下繼續前進,明天,希望漫步能像剛出生的太陽一樣蒸蒸日上。</p></td>
            </tr>
            <tr>
              <td height="12"></td>
              <td valign="top"></td>
            </tr>
          </table>
                  <table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
              <td height="3"></td>
            </tr>
            <tr>
              <td height="1" background="images/free_line_bg.gif" ><img src="images/free_line_bg.gif"></td>
            </tr>
          </table>
                  <table width="95%"  border="0" cellpadding="7" cellspacing="0">
            <tr bgcolor="E2E4E7">
              <td width="70%"><strong><img src="images/xia.gif" width="9" height="7" align="absmiddle"> 論壇新貼</strong></td>
              <td width="30%" bgcolor="E2E4E7"><strong><img src="images/n1.gif" width="16" height="12" align="baseline"> 社區版塊</strong></td>
            </tr>
        </table>                  
                  <table width="95%" height="100%"  border="0" cellpadding="1" cellspacing="0">
            <tr>
              <td width="70%" valign="top"><script language=javascript src=http://bbs.manbu.net/other/Article/topic.asp?BoardID=&Number=16&StrLen=50&NewWindow=yes></script><br><br></td>
              <td width="30%" valign="top" background="images/RightBG.gif"><script language=javascript src=http://bbs.manbu.net/ForumNav.asp></script></td>
            </tr>
      </table></TD>
        </TR>
</TABLE>

<table width="778" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="1" background="images/free_line_bg.gif" ><img src="images/free_line_bg.gif"></td>
  </tr>
  <tr>
    <td bgcolor="#f7f7f7"><table width="100%"  border="0" cellspacing="0" cellpadding="5">
      <tr>
        <td align="center">&copy; 2003-2005 ManBu.net,all rights reserved <script src="/count/count.asp"></script></td>
      </tr>
    </table></td>
  </tr>
</table>
<map name="Map">
  <area shape="rect" coords="458,37,534,59" href="#">
  <area shape="rect" coords="535,37,612,59" href="#">
  <area shape="rect" coords="613,37,690,59" href="http://bbs.manbu.net">
  <area shape="rect" coords="691,37,768,59" href="mailto:NeoWing@163.com">
</map>
</BODY>
</HTML>
[/html]
參考別人網站的時候要多看它的源代碼。
<script src="Scripts/fadeTicker.js" type="text/javascript"></script>這是實現那個滾動功能的JS文件;
<script type="text/javascript">

function initFadeTicker()
{
        popupLoad.style.visibility='hidden'  //隱藏提示窗口

        se = new fadeTicker();
se.addItem("<span style='color:#6F2BD5' title='漫步計劃推出Sql版統計系統(見內)'>漫步計劃推出Sql版統計系統(見內)</span><br><font color=#cccccc>(2004年4月5日)</font>","# onclick=window.open('News/File/Show.asp?News_Id=3','','height=400,width=500,resizable=yes,scrollbars=yes')");
se.addItem("<span style='color:#1A94E6' title='網站現有欄目'>網站現在還很簡陋,目前只有論壇這個欄目,其他欄目會慢慢製作完成,希望大家能繼續支持!謝謝!:)</span><br><font color=#cccccc>(2004年3月20日)</font>","#");
se.addItem("<span style='color:#FF6600' title='改版完成'>網站改版完成,希望大家喜歡還請大家繼續支持漫步:)謝謝!</span><br><font color=#cccccc>(2004年3月19日)</font>","#");

        se.init(
                        2, // set the speed
                        4, // set the delay (how long each message is viewable) (seconds)
                        '' // set the target (optional)
                );
       

}
onload = initFadeTicker
</script>定義了一個函數;
<TABLE WIDTH=778 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>
        <TR>
          <TD width="196" align="center" valign="top" bgcolor="#FFFFFF"><TABLE WIDTH=196 BORDER=0 align="center" CELLPADDING=0 CELLSPACING=0>
        <TR>
          <TD height="40"> <IMG SRC="images/ManbuPages_bak_4.gif" WIDTH=196 HEIGHT=40 ALT=""></TD>
        </TR>
        <TR>
          <TD height="113" align="center" background="images/ManbuPages_bak_6.gif"><table width="83%" height="113"  border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td valign="top">
<div style='float:left;width:100%'>        <div id='tickBox'>                <div id='tickCont'></div>        </div></div>
                                </td>
              </tr>
          </table>
這是那個有滾動內容的表格。

琢磨別人網站的時候最好給它來一個手術,看看每一個模塊都是幹什麼的,分析的多了就成了高手了,當然我不是 ^_^

呵呵謝謝教導!




Copyright © 1999-2000 LSLNET.COM. All rights reserved. 藍森林網站 版權所有。 E-mail : webmaster@lslnet.com