JavaScript

document.oncontextmenu = function () {return false;}

document.createElement('canvas');
var canvas = document.createElement('canvas');
canvas.setAttribute('width', window.innerWidth);
canvas.setAttribute('height', window.innerHeight);

var div = document.getElementById('demo');
div.appendChild(canvas);

var ctx = canvas.getContext('2d'); 
//var idata = ctx.createImageData(canvas.width, canvas.height);
//var buffer32 = new Uint32Array(idata.data.buffer);
function resize() {
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;
  console.table({w:canvas.width, h:canvas.height});
}
resize();
window.onresize = resize;

function noise(ctx) {
    
    var w = ctx.canvas.width,
        h = ctx.canvas.height,
        idata = ctx.createImageData(w, h),
        buffer32 = new Uint32Array(idata.data.buffer),
        len = buffer32.length,
        i = 0;

    for(; i < len;)
        buffer32[i++] = ((255 * Math.random())|0) << 24;
    
    ctx.putImageData(idata, 0, 0);
}

var toggle = true;

// added toggle to get 30 FPS instead of 60 FPS
(function loop() {
    toggle = !toggle;
    if (toggle) {
        requestAnimationFrame(loop);
        return;
    }
    noise(ctx);
    requestAnimationFrame(loop);
})();



canvas.style.cursor = 'crosshair';
document.getElementsByTagName('body')[0].style.overflowX = 'hidden';
document.getElementsByTagName('body')[0].style.overflowY = 'hidden';






window.addEventListener('click', function() {  resize();
  for(let i=0;i<9;i++){
    let bgm = new Audio("tv-noize.mp3");
    bgm.currentTime = i;
    bgm.loop = true;
    bgm.volume = 0.01;
    bgm.play();
  }
}, false );

window.addEventListener('dblclick', function() {
  //document.body.requestFullscreen();
  //canvas.requestFullscreen();
  //document.getElementsByTagName('body')[0].style.overflowY = 'hidden';
}, false );

document.addEventListener('fullscreenchange',function(e){
  resize();
});
//全画面にするとノイズが表示されない
//また通常時でもノイズは画像をコピーで再現されない

CSS