Was wondering if there was a way to do a css transition when div is
given a certain class.
Sure you can…
document.querySelector('#header').addEventListener('click', function(e) {
e.target.classList.toggle('transition');
})
#header {
background: red;
padding: 10px 0;
position: relative;
-webkit-transition: all 1s linear;
-moz-transition: all 1s linear;
-o-transition: all 1s linear;
transition: all 1s linear;
left:0;
}
#header.transition {
background: green;
left: 50px;
}
<div id="header">Click me to toggle class</div>
DEMO