ホームページ >ウェブフロントエンド >htmlチュートリアル >マーキータグを通じてスクロール効果を実現する純粋な HTML コード

マーキータグを通じてスクロール効果を実現する純粋な HTML コード

Y2J
Y2Jオリジナル
2017-05-23 10:04:582645ブラウズ

この記事では、JS コントロールを使用せずにさまざまなスクロール効果を実現できる HTML タグの使用方法を紹介します。興味のある方はぜひご覧ください。

自動ページ スクロール効果は JavaScript で実現できますが、今日私は偶然、JS コントロールなしでさまざまなスクロール効果を実現できる HTML タグ ed126914ed1419bab26abf7cf307b7b97204e33a7a23f6efcc788532e245c31b を発見しました。

マーキー マーカーを使用して、テキストだけでなく、画像なども移動します。

構文: ed126914ed1419bab26abf7cf307b7b9...7204e33a7a23f6efcc788532e245c31b; マーカー間のスクロールを追加します。

重要な属性:

1. スクロール方向 direction (4 つの値: up、down、leftrightを含む)

構文: 113b4f8754353ad07be616b025e5bedb...7204e33a7a23f6efcc788532e245c31b

2. スクロール動作 (スクロール: サイクルスクロール、デフォルト効果; スライド: 1 回だけスクロールして停止; 代替: 交互に前後にスクロール)

文法: < ;marquee behaviour="スクロール モード">...7204e33a7a23f6efcc788532e245c31b

3. スクロール速度のスクロール量 (スクロール速度は、スクロールするたびに移動する長さをピクセル単位で設定します)

構文: 803bf89a41c47553be5b45800afa3e65...7204e33a7a23f6efcc788532e245c31b

4. スクロール遅延scrolllay (スクロール間隔をミリ秒単位で設定)

構文: 34695e6898ccb333b28ad5f6efdc497f... 6. スクロール範囲

高さ

7. スクロールの背景色bgcolor8. 空白スペースhspace、vspace

JavaScriptコード

内容をクリップボードにコピー

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
<html xmlns="http://www.w3.org/1999/xhtml">   
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
<title>无标题文档</title>   
</head>   
<body>   
<p>   
<marquee direction="up" behavior="scroll" scrollamount="1" scrolldelay="0" loop="-1" width="1000" height="50" bgcolor="#0099FF" hspace="10" vspace="10">   
指整个Marquee对齐方式; (2)behavior:设置滚动的方式: scroll:表示由一端滚动到另一端,会重复,缺陷是不能无缝滚动。 slide:表示由一段滚动到另一端,不会重复...   
</marquee>   
</p>   
</body>   
</html>

【関連おすすめ】 1. HTML の無料ビデオチュートリアル

2.

HTML での個人履歴書作成のコード例

3.

新しい要素を作成する 3 つの方法を共有

4. HTML のメタタグの詳細な例

5. HTML ナレッジポイントの統合を共有する

以上がマーキータグを通じてスクロール効果を実現する純粋な HTML コードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。