1

ページは、タージ マジャルの形が打ち抜かれた白地 (つまり、マスク) で、文字はマスクの下のレイヤーで右から左にスクロールします。ここでビジュアルコンプを参照してください。

テキストの各行は個別にスクロールし、左端に到達するとループします。

私は SVG、HTML5/canvas、および jQuery マーキーを見てきました。これらの 1 つがこれに特に適していますか?

4

2 に答える 2

1

ブラウザーでこれを実現するために、レイヤー化された DIV と透明なグラフィックを使用できます。

jQuery は、テキストのマーキー動作の適切な実装を提供します。テキストを表示したい透明な領域と、それをマスクしたい白いピクセルを備えた PNG をレイヤー化するだけです。画像は、z オーダーでマーキー DIV の上に配置されます。

HTML5 と SVG の両方がこの動作をサポートする可能性がありますが、マーキー動作を実装する事前構築済みのコンポーネントを認識していないため、より多くの作業が必要になります。また、SVG も HTML5 も広く普及していないため、閲覧者が少ないページになってしまいます。

于 2010-09-23T21:17:45.890 に答える
0

これには、基本的な HTML で十分です。回避策は、ブラウザの非互換性でもあります。テキストの行の束の上に透明なマスク領域が完全に配置された大きな画像 (PNG または GIF) を用意するだけです。

シームレスにループさせたい場合は、各行を垂直方向に何度も複製して、可視領域を 2 回塗りつぶす必要があります。それが終わったら、タイマーで各行を移動するだけです。これは、ライブラリ アニメーション メソッドを使用せずに独自のアニメーション メソッドをすばやく展開するのが最も効率的かもしれませんが、各行で任意の種類のマーキー メソッドを個別に使用することもできます。

于 2010-09-23T21:19:34.050 に答える