プレゼンタイマー

https://gyazo.com/9a089f6be4ee1547c46eb4a368854366

code:style.css

.timer {

left: 0;

bottom: 0;

position: fixed;

padding: 16px;

background-color: #ffcaca;

font-size: 32px;

font-weight: 800;

margin-right: auto;

margin-left: auto;

z-index: 201;

}

code: script.js

let timerId = null;

let time = 0;

const toHHMMSS = function (sec_num) {

var hours = Math.floor(sec_num / 3600);

var minutes = Math.floor((sec_num - (hours * 3600)) / 60);

var seconds = sec_num - (hours * 3600) - (minutes * 60);

if (hours < 10) {hours = "0"+hours;}

if (minutes < 10) {minutes = "0"+minutes;}

if (seconds < 10) {seconds = "0"+seconds;}

return hours+':'+minutes+':'+seconds;

}

const pButton = Array.from(document.querySelectorAll(".dropdown-menu a")).filter(e => e.textContent.match(/Start presentation/))0;

pButton.addEventListener('click', e => {

const timerDOM = document.createElement('div');

timerDOM.className = 'timer';

document.body.appendChild(timerDOM);

setInterval(e => {

time += 1;

timerDOM.textContent = toHHMMSS(time);

}, 1000);

})