var theme_switch = document.getElementById("dark-light-switch"); var body = document.getElementsByTagName("BODY")[0]; function init( color ){ theme_switch.setAttribute("color", color); document.getElementById("dark-light-switch"); } function change(color){ window.setTimeout(function() { document.documentElement.classList.remove('color-theme-in-transition') }, 1000) document.documentElement.classList.add('color-theme-in-transition'); document.documentElement.setAttribute('data-theme', color); theme_switch.setAttribute("color", color); } function theme_changed(){ color = theme_switch.getAttribute("color"); if(color=="light") change("dark"); else change("light"); } var background = getComputedStyle(body).getPropertyValue("background-color"); if(background == "rgb(255, 255, 255)") { init("light"); } else { init("dark"); } theme_switch.addEventListener("click", theme_changed); theme_switch.addEventListener("touch", theme_changed);