● フリースペースに入れる(記事やメッセージボード、ルームにも配置可能)
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
● CSSへ追記(絶対配置したい場合)
/* ----------------------------------------------------- */
/* ■ スクロールメッセージの設定 */
/* ----------------------------------------------------- */
#MSG_scroll1{
position:absolute;
left:230px;/* 左からの位置 */
top:245px;/* 上からの位置 */
z-index:300;
}
● フォントサイズを変えたい場合
/* ----------------------------------------------------- */
/* ■ スクロールメッセージの設定(フォントサイズ) */
/* ----------------------------------------------------- */
#MSG_scroll1{
font-size:12px;
}
● 説明
◆ table
cellpadding=n 枠線とセルの内容の間の隙間をピクセル単位で指定します。
cellspacing=n 内枠の太さを指定。
① <table width="200px" 全体の長さ
② <td width="140px" メッセージ部分の長さ
③ ②は①より短くして、左側のお知らせは、①マイナス② となります。
オーバーした場合は縦に長く表示されるので注意してください。
◆ marquee
loop="infinite" を指定した場合、無限に繰り返されます
指定しない場合も無限
loop="回数" 回数分のみ繰り返しされます。
direction="方向" left right down upを指定
behavior="動作の仕方"
behavior="scroll" 画面を横切る動作(繰り返し)
behavior="alternate" 画面を往復する動作(繰り返し)
behavior="slide" 端まで来ると停止
bgcolor="背景色"
scrolldelay="時間の間隔" 移動時間間隔(秒数単位は1/1000秒、初期値:85)
scrollamount="進む距離" 移動距離(初期値:6)
truespeed scrolldelayが59以下の場合に指定
truespeed scrolldelayが59以下の場合に指定
◆ 例①
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例② direction="left"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee direction="left" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例③ direction="right"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee direction="right" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例④ behavior="scroll"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee behavior="scroll" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例⑤ behavior="alternate"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee behavior="alternate" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例⑥ behavior="slide"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee behavior="slide" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例⑦ scrolldelay="40" scrollamount="13"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee scrolldelay="40" scrollamount="13" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
◆ 例⑧ scrolldelay="210" scrollamount="2"
<div id="MSG_scroll1">
<table width="200px" cellspacing="1" bgcolor="#ff00ff"><tbody><tr><td align="center"><font color="#ffffff">お知らせ</font></td><td width="140px" bgcolor="#000000"><marquee scrolldelay="210" scrollamount="2" loop="infinite"><font color="#ff00ff">スクロールしたい文字</font></marquee></td></tr></tbody></table>
</div>
お知らせ |
● 絶対配置で、複数設定したい場合は、MSG_scroll1 を順番に MSG_scroll2 MSG_scroll3 と
数字を上げて行ってください