7

情報モニターとして使用される非公開の Web アプリを構築しています。そのため、1 つの LCD TV ディスプレイで 24 時間年中無休で実行されます。

これにより LCD に「焼き付き」エラーが発生する可能性があるため、この問題を防止/軽減する Javascript を探しています。空港のディスプレイで使用されているものと同様のものを使用したいと考えています (線が定期的に左から右、上から下に移動し、色が切り替わります)。

これを行うJavascriptを知っていますか?ありがとうございました!

4

2 に答える 2

18

それでも興味がある場合: (jQuery を使用)

var $burnGuard = $('<div>').attr('id','burnGuard').css({
    'background-color':'#FF00FF',
    'width':'1px',
    'height':$(document).height()+'px',
    'position':'absolute',
    'top':'0px',
    'left':'0px',
    'display':'none'
}).appendTo('body');

var colors = ['#FF0000','#00FF00','#0000FF'], color = 0, delay = 5000, scrollDelay = 1000;
function burnGuardAnimate()
{
    color = ++color % 3;
    var rColor = colors[color];
    $burnGuard.css({
        'left':'0px',
        'background-color':rColor,
    }).show().animate({
        'left':$(window).width()+'px'
    },scrollDelay,function(){
        $(this).hide();
    });
    setTimeout(burnGuardAnimate,delay);
}
setTimeout(burnGuardAnimate,delay);

ここにある実例: http://www.jsfiddle.net/bradchristie/4w2K3/3/ (またはフルスクリーン版)

于 2011-01-19T23:19:35.933 に答える
0

私は Brad のスクリプトを使用しましたが、残念ながら私のページには、親コンテナーの外側に拡張された大きな HTMl テーブルがありました。これにより、ピクセルバーが画面の途中までしか移動しないようになりました。テーブルを変更する代わりに、境界ボックス スクリプトを追加して html テーブルの実際の幅を見つけ、それを使用して Brad のスクリプトで幅を設定しました。

var div = document.getElementById ("HtmlTable-ID");

        if (div.getBoundingClientRect) {       
            var rect = div.getBoundingClientRect ();

            w = rect.right - rect.left;

           // alert ("  Width: " + w );
        }

var $burnGuard = $('<div>').attr('id','burnGuard').css({
    'background-color':'#FF00FF',
    'width':'1px',
    'height':$(document).height()+'px',
    'position':'absolute',
    'top':'0px',
    'left':'0px',
    'display':'none'
}).appendTo('body');

var colors = ['#FF0000','#00FF00','#0000FF'], color = 0, delay = 5000, scrollDelay = 1000;
function burnGuardAnimate()
{
    color = ++color % 3;
    var rColor = colors[color];
    $burnGuard.css({
        'left':'0px',
        'background-color':rColor,
    }).show().animate({
        'left': w +'px'
    },scrollDelay,function(){
        $(this).hide();
    });
    setTimeout(burnGuardAnimate,delay);
}
setTimeout(burnGuardAnimate,delay);
于 2014-09-17T02:54:18.243 に答える