返回首頁
當前位置: 主頁 > 網絡編程 > Asp實例教程 >

如何制作HTML字幕動畫效果及核心代碼

時間:2012-07-02 01:11來源:知行網www.wzliqi.com 編輯:麥田守望者

我們在瀏覽網頁的時候,有時會看到網頁中有些文字會循環往復的移動。這種動畫效果是如何制作的呢?這里我們就來看一看。
  當然我們可以利用flash或者采用Gif動畫來實現,但是這種方式往往占用的空間比較大,而且不如HTML標記來得那么簡單。這個標記就是Marquee標記,中文翻譯為“跑馬燈”。IE3.0以上版本的瀏覽器中支持這個HTML標記,而NetScape則不支持。因此我們在設計網頁的時候需要考慮這個問題。

  Marquee標記的基本語法結構如下所示 :
  <MARQUEE ALIGN=″alignment″ BEHAVIOR=″type″ BGCOLOR=″color″ DIRECTI ON=″direction″ SCROLLAMOUNT=″n″ SCROLLDELAY=″n″ LOOP=″n″ WIDTH=″x″ HEIGHT=″y″ HSPACE=″x″ VSPACE=″y″>洪恩在線,12億中國人的網上大學</MARQUEE>

  其中ALIGN可以用來指定滾動字幕與左右文字的對齊方式,它的值可以有top、middle、bottom等;

   BEHAVIOR用來指定滾動字幕的滾動方式,它的屬性值有scroll、slide和alternate三個,scroll表示滾動字幕內容向同一方向重復滾動,slide表示滾動字幕內容從一端向另一端滾動并在另一端停止,alternate表示滾動字幕內容在兩端之間來回往復滾動;

   DIRECTION指定滾動字幕的滾動方向,它的屬性值有left和right兩個,分別表示滾 動字幕由右向左和由左向右滾動;SCROLLAMOUNT用來設置多次滾動之間的間隔距離,其 單位是pixels(像素);

   SCROLLING用來指定滾動字幕滾動一次所需要的時間,單位是ms(千分之一秒), 其值的大小將直接影響滾動字幕的滾動速度;

  LOOP屬性是用來指定滾動字幕的滾動次數 的,當它的值為“-1”時,滾動字幕將連續滾動直到瀏覽器載入下一個頁面;

  HSPACE和 VSPACE則分別用來指定滾動字幕與其上一級頁面在水平方向和豎直方向上的距離。

  下面我們看一看跑馬燈的效果。(注意:這種跑馬燈的效果只在Internet Explorer中能看到,Netscape不支持marquee標記)

------分隔線----------------------------
標簽(Tag):html5 HTML html技巧 html實例教程 html源代碼 html基礎教程
------分隔線----------------------------
推薦內容
猜你感興趣
久久99久久99精品免视看