ページ上のオブジェクトをDOMのスタイル制御で虹色に変化させるスクリプト。 比較的処理を食うらしいのでCPUリソースに余裕がない場合は注意。 「START」ボタンで動作開始。「STOP」ボタンで停止。
Rainbow color test
0 to 255
to 0 to 255
Upper 1 (ms)
スクリプトソース例の表示
ずっと昔にDOMでオブジェクトのリアルタイムスタイル制御の勉強のために作ったものを最近になって発掘したので蔵出ししてみる。色変化のタイミングや制限値、変化幅等いろいろな値を可変してリアルタイムに確認できるところがポイントなのかな。
DOMでリアルタイムスタイル制御という今世紀の技術(大げさな……)を使って、やってることは前世紀の“目立つ!カッコイイ!!ホームページデザイン”なところがちょっと恥ずかしく、また、ひとまわり回ってちょっといいかも……なんて思ってみてしまったり。
確か作ったときはNetscape6だか7だかの頃で、「Color change time」(色変化の間隔)を1msに設定すると勤勉実直に頑張ってくれて、フレームレート120でCPU使用率100%!!なんて恐ろしいことになってたりしたけど、今のFirefox2では全然余裕CPU使用率5%と安全設計。(追記参照)フレームレートは64止まりだけど。

昔はこういうギンギラなのはgifアニメでやってたよね~とか懐かしい思い出。 今はそんなギンギラでとんがったサイト、愛生会 病院くらいしか見ないような気がする。

追記:
ローカルでFirefox2で確認した時点ではCPU使用率5%だったんだけど、ブログにアップして表示してみるとなんとCPU使用率70%(P4-2.6GHz使用)まで行くことが判明したので、読み込み後自動でアニメーション開始処理をしないように変更。
ちなみにIE6では50%前後だったので根本的にスクリプトが重いってことらしい。ブラウザを広げるとCPU使用率が上がってゆく……。でもフリーズすることは無いらしい。
関連記事
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Comment
※コメントスパム防止の為半角httpと全角wをNGワードに設定してあります。






(編集・削除用)

 

管理者にだけ表示を許可
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Trackback
http://nekomimya.blog28.fc2.com/tb.php/71-bf45c704
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ブログ表示設定
横:
縦:
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
プロフィール

寝込み屋(nekomimya)

Author:
寝込み屋(nekomimya)
twitter:
寝込み屋(@nekomimya)

リンクはご自由に。外すのもご自由に。

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ブログ内検索
ブログ内検索(Google)
※要JavaScript、別ウィンドウで結果表示
ブログ内検索(FC2)
※検索結果が表示されないことがあり
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
最近の記事
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
最近のコメント
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
最近のトラックバック
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
月別アーカイブ
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
カテゴリ
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
RSSフィード
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
リンク
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
FC2リンク
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
    FC2カウンター
    閲覧者数合計


    現在の閲覧者数
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
    最近の画像
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
    検索フォーム