JSFiddle - React, Tailwind, and code Playground

by Igaojsfiddle

HTML

<script src="http://jackrugile.com/jrumble/js/jquery.jrumble.1.3.min.js"></script>
<div class="out">
    <img src="http://img2.appstatic.opera.com/prodimgres/mo_icon_big_thumb_230467.png" alt="">
</div>

CSS

.out {
    padding:3px;
    border-radius: 50%;
    width: 128px;
    height: 128px;
    border: 3px solid #ececec;
    box-shadow: 1px 10px 8px #888888;
}
img {
    border-radius: 50%;
    width: 128px;
    height: 128px;
}

JavaScript

$('.out').jrumble();

// Demo 19
var demoTimeout;
$('.out').click(function(){
	$this = $(this);
	clearTimeout(demoTimeout);
	$this.trigger('startRumble');
	demoTimeout = setTimeout(function(){$this.trigger('stopRumble');}, 500)
});

$(".out").effect( "shake", {times:1}, 200 );