JSFiddle - React, Tailwind, and code Playground
HTML
<div class="block">
</div>
CSS
.block{
height: 100px;
background: #000;
}
.mobil{
background: red;
}
.mobil--clicked {
background: blue;
}
JavaScript
$('body').on('click', '.mobil', function() {
$(this).addClass("mobil--clicked");
});
window.onresize = (function() {
var $element = $('.block'),
$doc = $(document),
doit,
resizedw = (function func(){
if ( $doc.width() < 500 ){
$element.addClass("mobil");
} else {
$element.removeClass("mobil mobil--clicked");
}
return func;
})();
return function() {
clearTimeout(doit);
doit = setTimeout(resizedw, 0);
}
})();