Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Dynamic CSS modification
<html>
<body>
<style class="style"></style>
<pre></pre>
<script>
let style = `
body {
color: green;
background-color: black;
}
pre {
transition: all 3s;
padding-top: 10vh;
padding-left: 30vw;
transform: rotate(360deg);
}
`;
let counter = 0;
let interval = setInterval(function () {
if(counter >= style.length) {
clearInterval(interval);
return;
}
document.querySelector('pre').innerHTML += style[counter];
document.querySelector('.style').innerHTML += style[counter];
counter++;
},30);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.