JSFiddle - React, Tailwind, and code Playground

by jquerybyexample

HTML

<script src="http://jackrugile.com/jrumble/js/jquery.jrumble.1.3.min.js"></script>
<div id="dvContent">
Follow US on
<br/>
<img src="http://3.bp.blogspot.com/_pP4JIb2v5LA/TJnBwFevbMI/AAAAAAAABTw/AdekgXUQMz0/s1600/konqsidebar_news.png" />
<img src="http://3.bp.blogspot.com/_pP4JIb2v5LA/TJnBpr56SDI/AAAAAAAABTs/LfHACwgIFPM/s1600/Twitter_128x128.png" />
<img src="http://1.bp.blogspot.com/_pP4JIb2v5LA/TJm_XGJmbbI/AAAAAAAABTg/IxG2s_qRzL0/s1600/FaceBook_128x128.png" />
<img src="http://1.bp.blogspot.com/_pP4JIb2v5LA/TKRPzcU9bmI/AAAAAAAABT4/RH2w_z6IGXI/s1600/Email-RSS-Icon256.png" />
</div>

CSS

body
{
    font-family: Verdana;
    font-size : 20pt;
    padding : 10pt;
    color : green;
}

img{
    width:50px;
    height:50px;
}

JavaScript

$(document).ready(function() {
    $('img').jrumble({
        x: 2,
        y: 2,
        rotation: 1
    });

    $('img').hover(function() {
        $(this).trigger('startRumble');
    }, function() {
        $(this).trigger('stopRumble');
    });
});