==教えることは自分育て==

カテゴリ:├マーキー( 1 )
|TOPに戻る
マーキーのタグ
梅雨に入りましたね~。みなさま、どうぞお元気でお過ごしくださいませ。

↑上は文字を<marquee></marquee>のタグで囲っただけです。見てお分かりのように、ブロック要素ですから、デフォルトでは幅一杯右から左へ
流れて消え、また右から現われ、それを繰り返します。スピードはデフォルトはこの速さです。

画像も動かせますよ。<marquee>画像の擬似タグ</marquee>
ほら、簡単ですね。
b0063421_2227113.gif


marqueeタグは以前はIE限定でしたが、今ではfirefox・netscapeでもOKとなり使いやすくなりましたね。属性はブラウザによりバグがあるようです。

そのほかの動きをつける属性は、以前まるちゃんがお薦めのサイトをご覧になるほうがわかり易いと思います。 こちらからどうぞ。(←引っ越されているようです)


主なものを下に列記します。
scrollamount="4"・・・・・・・・・・流れる速さ
width="ピクセル値"・・・・・・・流れる幅
height="ピクセル値"・・・・・・・流れる高さ
behavior="slide"・・・・・・・・右から左へと流れて止まる
behavior="alternate"・・・・往復運動
direction="right"・・・・・・・・左から右へ流れる
direction="up"・・・・・・・・・・下から上へと流れる
direction="down"・・・・・・・上から下へ
loop="3"・・・・・・・・・・・・・・・3回流れて止まる(回数)
scrolldelay="85"・・・・・・・・次の表示までの時間

線・背景等も考えて、いろいろ組み合わせると面白いことが表現できますよ~!!
<サンプル>

b0018441_15322935.gif
b0018441_15325717.gif
b0018441_15331279.gif
b0018441_16341724.gif


マーキーで海中散歩です。素材はこちらからいただきました。

下は「ブログでCSS講座」の卒業作品をキャプチャーしたものです。
卒業作品のねらいは、divの枠の背景に画像を貼るということです。
背景に貼ると、前面には、文字や画像を入れることができます。

TOP画像がそうですね。ですから、ブログタイトルもURLも貼れるのです。
コメント欄もそうですね。ポイント画像の上に、コメント文字を入力できるのです。

マーキーだけでこんなに豊かに表現できるとは、正直驚いています。
キャプチャー(画像化)ですので、動かないのが残念です。
皆さん、頑張られましたね。受講有難うございました。

b0018441_21432791.jpgb0018441_2142615.jpgb0018441_21515324.jpg
b0018441_2143217.jpgb0018441_21442257.jpgb0018441_21445171.jpg
b0018441_21461949.jpgb0018441_21463851.jpgb0018441_21465671.jpg
b0018441_21471944.jpgb0018441_21474382.jpgb0018441_2148275.jpg


最後に、バラの花のオンパレードです。
これは画像を結合していません。全部で8枚の画像です。疑似タグのままですと、imgに余白が設定されていますので、隙間が空きます。本来の<>タグに直すと、ピタッと付きます。


[PR]
by otomi7771 | 2004-12-18 17:32 | ├マーキー |TOPに戻る