Javascript для предотвращения проблемы «выгорания» на ЖК-экране - PullRequest
Новая
       10

Javascript для предотвращения проблемы «выгорания» на ЖК-экране

7 голосов
/ 20 января 2011

Я создаю закрытое веб-приложение, которое будет использоваться в качестве инфо-монитора. Таким образом, он будет работать круглосуточно на одном ЖК-телевизоре.

Так как это может привести к ошибке «цвета прожигания» на ЖК-дисплее, я ищу Javascript, который позволит предотвратить / уменьшить эту проблему. Я хочу использовать нечто похожее на те, которые они используют на дисплеях аэропортов (линия, периодически перемещающаяся слева направо и сверху вниз и меняющая цвет).

Знаете ли вы какой-нибудь Javascript, делающий это? Спасибо!

Ответы [ 2 ]

14 голосов
/ 20 января 2011

Если вам все еще интересно: (использует 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/ (или полноэкранная версия )

0 голосов
/ 17 сентября 2014

Я использовал скрипт Брэда, но, к сожалению, на моей странице была большая таблица HTMl, выходящая за пределы родительского контейнера. Это сделало так, чтобы пиксельная панель проходила только часть экрана. Вместо того, чтобы изменять свою таблицу, я добавил скрипт ограничивающего прямоугольника, чтобы найти фактическую ширину HTML-таблицы, а затем использовал ее для установки ширины в скрипте Брэда. 

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);
...