けとけと。の自由帳

けとけと。の自由帳

『スクロール』

スクロールとは?

MARQUEE(マーキー)タグと言って,InternetExplorer(通称IE)専用.
NetscapeNavigator(通称ネスケ)というブラウザでは動作しないので,自分がうまく表示されたからと言って他の人がちゃんと見れるとは限らない機能.
ちなみに性能が低いPCなのではこの機能が多用されているといろんな処理が遅くなったりする.
まぁ,楽天でそんなこたぁ~気にしてる人は少ないだろう(笑)

そうそう.終了部分を書き忘れてページ全体がスクロールして,あとで困る人もいるので気をつけてね(^^)

要素名

 MARQUEE

使用可能な属性と値

 width  ・・・ スクロールする領域の幅
 height ・・・ スクロールする領域の高さ
   値:ピクセルまたは%(パーセント)で指定.%の時は「80%」っと言った感じに「%」をつけること.
     %はウインドウのサイズに対する割合になる.

 hspace ・・・ マーキーの左右マージン(余白)
 vspace ・・・ マーキーの上下マージン(余白)
   値:ピクセルで指定.

 behavior ・・・ スクロールの仕方
   値:scroll    ・・・ 1方向からのみスクロールしてくる.
     alternate ・・・ スクロール領域の端に来ると逆方向に動き出す.
     slide     ・・・ スクロール領域の端に来ると停止する.

 direction ・・・ スクロールする方向
   値:left  ・・・ 右から左にスクロール(この属性を指定しないときはこの動きになる).
     right ・・・ 左から右にスクロール.
     up    ・・・ 下から上にスクロール.
     down  ・・・ 上から下にスクロール.

 loop ・・・ スクロール回数
   値:回数.0または-1やこの属性を指定しない場合は無限.

 scrolldelay ・・・ 再描画までの時間
   値:秒数(1/1000秒単位).
     スクロールは一度表示しているものを消してから位置をずらして表示させる.
     そのための再描画の時間を設定する.
     そのため値が大きいと遅くスクロールしているように見える.
     1秒後に表示させる場合は1000を指定.属性を指定しない場合は85である.

 scrollamount ・・・ 再描画までの移動距離
   値:ピクセル.
     上でも説明したように,スクロールは一度表示しているものを消してから位置をずらして表示させる.
     その次の表示位置までの移動距離を設定する.
     そのため値が大きいと飛んでスクロールしているように見える.
     属性を指定しない場合は6である.

 truespeed ・・・ 属性scrolldelayの値が60未満で,指定したとおりの時間にしたい場合はこの属性も指定.
          この属性を指定しないでscrolldelayに60未満の値を設定したときは60のときと同じ動作となる.

 bgcolor ・・・ スクロール領域に色をつける.
   値:色数値または色名称
     色数値とは #FF66AA 
のような指定をする.
     色名称とは RED 
 YELLOW 
のような指定をする.
記述

 <MARQUEE>要素内容 </MARQUEE>

属性を全部指定すると次のようになる

 <MARQUEE width="値" height="値" hspace="値" vspace="値" behavior="値" direction="値" loop="値" scrolldelay="値" scrollamount="値" truespeed bgcolor="値">要素内容 </MARQUEE>

使用例 (上:結果 下:記述 ※但し自動改行なしの設定で記述)

属性を何も指定しなければこんな動き. スクロール範囲に色を指定してみました. 端まで行くと反対方向に動きます. スクロール範囲をウインドウの50%に. スクロール方向を左から右へ.そして左右のマージンを50ピクセルに. 再描画の時間を1秒に. 移動距離を10ピクセルに. スクロールの指定が違うものを組み合わせると...
 <MARQUEE> 
属性を何も指定しなければこんな動き. </MARQUEE> 
 <MARQUEE bgcolor="#ffcc99"> 
スクロール範囲に色を指定してみました. </MARQUEE> 
 <MARQUEE bgcolor="#ffcc99" behavior="alternate"> 
端まで行くと反対方向に動きます. </MARQUEE> 
 <MARQUEE bgcolor="#ffcc99" width="50%"> 
スクロール範囲をウインドウの50%に. </MARQUEE> 
 <MARQUEE bgcolor="#ffcc99" direction="right" hspace="50"> 
スクロール方向を左から右へ.そして左右のマージンを50ピクセルに. </MARQUEE> 
 <MARQUEE bgcolor="#ffcc99" scrolldelay="1000"> 
再描画の時間を1秒に. </MARQUEE> 
 <MARQUEE bgcolor="#ffcc99" scrollamount="10"> 
移動距離を10ピクセルに. </MARQUEE> 
 <MARQUEE direction="left"> 
 <MARQUEE direction="down"> 
スクロールの指定が違うものを組み合わせると... </MARQUEE> 
 </MARQUEE> 

© Rakuten Group, Inc.
Design a Mobile Website
スマートフォン版を閲覧 | PC版を閲覧
Share by: