Skip to content

Instantly share code, notes, and snippets.

@gustawdaniel

gustawdaniel/index.html

Created March 3, 2018 15:38
Show Gist options
  • Save gustawdaniel/ffdf06a67f8cfc41326d372bc20a6b4a to your computer and use it in GitHub Desktop.
Save gustawdaniel/ffdf06a67f8cfc41326d372bc20a6b4a to your computer and use it in GitHub Desktop.
Download ZIP
Dynamic CSS modification
Raw
index.html
<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