JSFiddle - React, Tailwind, and code Playground

by skoshy

HTML

<div id="go">
    Click here to trigger a JavaScript alert in 3 seconds. Make sure to lock your Ubuntu screen before the alert shows up!
</div>

<div id="lock">
    Lock your screen!
</div>

CSS

#go {
    padding: 10px;
    border: 1px solid #3CC255;
    background-color: #9CFFAE;
    cursor: pointer;
}

#lock {
    display: none;
    text-align: center;
    padding: 20px;
}

JavaScript

var timer;

function showAlert() {
    alert('This will display Chrome over the lock screen.');
    clearInterval(timer);
}

$('#go').click(function(){
    timer = setInterval(showAlert,3000);
    $('#lock').stop().show().fadeOut(1000);
});