<marquee>タグは、ペアで表示されるタグです。最初のタグ<marquee>と最後のタグ</marquee>の間のコンテンツは、コンテンツのスクロールです。 <marquee>タグの属性には、主に動作、bgcolor、方向、幅、高さ、hspace、vspace、loop、scrolllamount、scrolldelayなどが含まれます。これらはすべてオプションです。
今日、私がWeChatで大きなターンテーブル宝くじを描いていたとき、私はすべてのユーザーの宝くじ記録をシームレスなスクロール効果にしたかったのです。残念ながら、私のJS財団はあまりにも貧弱で、当面を達成する方法を考えられなかったので、Baiduにさまざまな効果がありました。しかし、私は誤ってHTMLタグを発見しました - <Marquee> </marquee>は、JSコントロールなしで複数のスクロール効果を達成できます。マーキータグを使用すると、テキストをスクロールするだけでなく、画像、テーブルなどをスクロールすることもできます。また、便利で迅速に使用できるため、本当に時間を節約できます。
マーキータグはHTML3.2の一部ではなく、MSIE3の後のカーネルのみをサポートするため、非IEカーネルブラウザー(Netscapeなど)を使用する場合、以下に興味深い効果を見ることができない場合があります。このタグはコンテナタグです。
1.マーキータグのいくつかの重要な属性:1.方向:スクロール方向(4つの値を含む:上、下、左、右)
説明:UP:下から上にスクロールします。ダウン:上から下にスクロールします。左:右から左にスクロールします。右:左から右にスクロールします。
構文:<マーキー方向=スクロール方向> ... </marquee>
2.Behavior:スクロール方法(3つの値を含む:スクロール、スライド、変更)
説明:スクロール:ループスクロール、デフォルト効果。スライド:一度だけスクロールするときは停止します。代替:交互に前後にスクロールします。
構文:<Marqueeの動作=スクロール方法> ... </marquee>
3.Scrollamount:スクロール速度(スクロール速度は、各スクロールが設定されているときの動きの長さ、ピクセルです)
構文:<marquee scrollamount = 5> ... </marquee>
4。Scrolldelay:スクロールの間に2回遅延時間を設定します。値が大きい場合、段階的な効果があります(スクロール時間間隔を設定すると、ユニットはミリ秒です)
構文:<marquee scrolldelay = 100> ... </marquee>
5.ループ:スクロールサイクルの回数を設定します(デフォルト値は-1、スクロールはサイクルを続けます)
構文:<marquee loop = 2> ... </marquee>
<Marquee loop = -1 bgcolor =#cccccc>歩き続けます。 </marquee>
<Marquee loop = 2 bgcolor =#cccccc>私は2回だけ行きます</marquee>
6.幅、高さ:スクロール字幕の幅と高さを設定します
構文:<Marquee width = 500 height = 200> ... </marquee>
7.BGCOLOR:スクロール字幕の背景色を設定します(色の値、またはrgb()またはrgba()function)
構文:<marquee bgcolor = rgba(0,0,0,0.2)> ... </marquee>
8.HSPACE、VSPACE:空白スペース(マージン値の設定に相当)
説明:HSPACE:hspace = 10などの親コンテナの水平境界からアクティブ字幕内の位置間の距離を設定します。
VSPACE:vspace = 10などの親コンテナの垂直境界からアクティブ字幕内の位置間の距離を設定します。これは、マージン:10px 0に相当します。
構文:<Marquee hspace = 10 vspace = 10> ... </marquee>(相当:マージン:10px;)
9. align:字幕をスクロールするアライメント方法を設定します(9値を含む:absbottom、absmiddle、baseline、bottom、左、右、右、textop、top)
説明:Absbottom:g、p)などの文字の一番下の端に並んでいるabsbottom
Absmiddle:絶対に中心的なアライメント
ベースライン:最終的なアライメント
ボトム:ボトムアライメント(デフォルト)
左:左アライメント
中央:中央アライメント
右:右アライメント
TextTop:トップラインアライメント
上:トップアライメント
構文:<marquee align = align> ... </marquee>
10.フェイス:字幕をスクロールするためにテキストフォントを設定します
構文:<marquee font = kaiti_gb2312> </marquee>
11.Color:スクロール字幕のテキスト色を設定します
構文:<Marquee Color =#333> </marquee>
12.サイズ:スクロール字幕のテキストフォントサイズを設定します
構文:<マーキーサイズ= 3> </marquee>
13.strong:スクロール字幕のテキストを太字にするように設定します
2。マーキーが使用する2つの一般的なイベント:構文:<Marquee strong> </marquee>
onmouseout = this.start()は、マウスを設定するために使用され、この領域から移動するときにスクロールを続けます。
onmouseover = this.stop()は、マウスを設定して、この領域に移動したときにスクロールを停止します。
<marquee onmouseout = this.start()onmouseover = this.stop()> Marquee>が使用する2つの一般的なイベント</marquee>
完全なコードは次のとおりです。
<Marquee ID = Affiche Align = left Behavior = Scroll BGColor =#FF0000 Direction = up Height = 300 width = 200 hspace = 50 vspace = 20 loop = -1 scrollmount = 10 scroolldelay = 100 onmouseout = this.start()onmouse = onmouse = this.stop()>>>>>
<marquee>には多くのパラメーターがありますが、結局複雑でカスタマイズされた特別なマーキー効果を達成することはできず、ブラウザの制限があります。そのため、より多くの場合、JavaScriptを使用してマーキースクロール効果を実現します。
これは、HTMLのシームレスなスクロールマーキータグの効果に関する記事です。これはすべてこの記事です。シームレスなスクロールマーキーのより関連するコンテンツについては、wulin.comから以前の記事を検索するか、以下の関連記事を閲覧し続けてください。将来、誰もがwulin.comをサポートすることを願っています!