動く文章・画像の続きです。
前回の記事はこちらから→動く文章・画像①
今回は様々な動きを行ってみたいと思います。
これはHTMLになり、CSSではありませんのでブログを書くなどで使うことが出来ます。
ブログを書くを選択したら、[HTMLタグを表示]をクリックすることでHTMLで書き込むことが出来ます。
通常は
※分かりやすいように太文字で表示しています。
こんな形で動きますが、いろいろな動きに変えてみます。
スピードを変える
<marquee scrollamount="20" truespeed>ここに文章を書いてください。</marquee>
20という数字の部分を大きくすれば早くなり、小さい数字にすれば遅くなります。
左から右へ方向を変える
現在は右から左に流れていきますが、逆に左から右へ流れるように変えてみます。
<marquee direction="right">ここに文章を書いて下さい。</marquee>
これで逆から流れるように変わります。
下から上へ方向に変える
横に流れる動きではなく、下から上に流れる動きに変えてみます。
<marquee direction="up">ここに文章を書いて下さい。</marquee>
下から上に動くように変わりました。
上から下へ方向を変える
今度は、上から下に流れる動きに変えてみます。
<marquee direction="down">ここに文章を書いて下さい。</marquee>
これで上から下への動きに変わりました。
範囲内で動くように変える
<marquee behavior="alternate">ここに文章を書いて下さい。</marquee>
範囲内で左右に動くようになります。
いろいろな動きをすることが出来ますね。
ここに文章を書いてください。
という部分を画像にしたり、文章の色、太さを変えればもっと見え方も変わってきますので試してみて下さい。
