Como programar la ley de cookies con Javascript

A nivel de CSS se elige un posicionamiento fijo para el banner.

Como peculiaridad podemos jugar con la propiedad opacity para el banner.ç

El botón de aceptar es en realidad un div al que se le asigna un hover y un evento mediante javascript.

Pasemos directamente a ver el código javascript.

window.onload=init;
function init(){
    bloqueRGPD = document.getElementById("emergenteRGPD");
    
    if(detectCookie("rgpdOK")){
        if (getCookie("rgpdOK")==1){eliminarBloqueRGPD();}
    }else{
        document.getElementById("botonRGPD").addEventListener("click",function(){
        eliminarBloqueRGPD();
        setCookie("rgpdOK",1,365);
        })        
    }
}

function eliminarBloqueRGPD(){
    bloqueRGPD.parentNode.removeChild(bloqueRGPD);
}

Hay dos funciones principales: init y eliminarBloqueRGPD.

Dentro de init fijaros en el uso de una función anónima.

La idea de la resolución es que si se detecta una cookie se comprueba su valor. Si el valor es 1 directamente se elimina del DOM el bloqueRGPD.

En caso de que el valor sea cualquier otro o que no se detecte la cookie entonces sale la ventana emergente y se asigna comportamiento de botón al div.

Cuando se hace clic en el div se elimina el bloqueRGPD y se inserta una cookie de 365 días de duración.