画像スライド

 今日は海の日で、小学校もお休み!娘たちは、友達の家へ遊びに行っています。そちらは「さえずり」をご覧いただくとして、今日は、久しぶりにブログの話題を一つ。実は、先日来、一番上に設定したトップページの写真がスライドすることに気づかれたでしょうか。わたくしも、この、エキサイトのブログで、こういうわざができるとは、今まで、気がつきませんでした。方法は簡単。まず、画像をアップロードします。画像は[~]で囲まれていますから、この[~]<marquee direction=up height=☆>[~]</marquee>という具合にはさんでやります。以下では</marquee>を省略していますが、最後にこれを忘れると、後の文章も画像も、すべてスライドしてしまいますから、気をつけてください。☆でピクセルを指定すれば、画像すべてあるいは一部を、好きな大きさで表示できます。ここまでだと、画像の動く早さと、動きっぱなしかスライドが終わるととまるかが指定できませんが、
<marquee scrollamount=★ direction=up height=◆ behavior=slide>と指定すると(★、◆は数字)、
e0031331_14151147.jpg
のように動きます。ちなみにこの画像は、
<marquee scrollamount=2 height=350 behavior=slide>です(scrollamountは動く早さ。正確には「画像を再度表示するまでのピクセル数」 heigtは画像の表示される高さ)。
<marquee scrollamount=★ direction=up height=◆>までの指定だと
e0031331_14205469.jpg
と、画像は、繰り返し、下から上に動きます。direction=down にすれば、今度は、上から下に動きます。ちなみに、scrollamount=4 と動きを早め、height=300 にせばめてみました。
e0031331_14532890.jpg

横に動かしたいときは、<marquee scrollamount=★>だけでOK!
e0031331_14243089.jpg
これだけの指定だと、普通、右から左に動くので、左から右に動かしたいときは、
direction=right(右方向へ動く) を指定します。
もっと小さな画像の場合、behavior=alternate を指定すると、右から出てきた画像は、左に行くと折り返して、後は、左右に行ったり来たりします。下の画像は
<marquee scrollamount=2 behavior=alternate>です。
e0031331_14353589.jpg

絵文字などを、あちこちのサイトから拝借してくるのもいいですが、自分のとった写真を動かして見るのもおつなものです。もちろん、もうご存知のかたが多いとは思いますが、まだ、ご存じない方、興味のある方は、試してみてください!スライドしてきてとまった画像を再度動かしたい場合には、この記事がアップされた7月17日をクリックすると画面が変わって、もう一度、画像が動きます
[PR]

by omasico | 2006-07-17 15:45 | HP・ブログ・通信  

<< 濁流・激流 購入検討 >>