Hide element based on container width
HTML
<div class="container">
<div class="floated"></div>
<div class="floated"></div>
</div>
CSS
.container {
border: 1px solid black;
height: 100px;
width: 260px;
transition: width 700ms;
}
.floated {
float: left;
border: 1px solid blue;
height: 70px;
width: 100px;
margin: 10px;
}
JavaScript
var elem = document.getElementsByClassName('container')[0];
var increase = false;
setInterval(function() {
if (increase) {
elem.style.width = '260px';
} else {
elem.style.width = '240px';
}
increase = !increase;
}, 700);