JSFiddle - React, Tailwind, and code Playground

HTML

<div id="img2"></div>

CSS

#img2 {
    height:300px;
    background-image:url('http://www.thesearchagents.com/wp-content/uploads/2013/11/Google-Search.jpg');
    background-size: 100% 300px;
    background-repeat:no-repeat;
    -webkit-transition: background-image 0.5s ease-in-out;
    -moz-transition: background-image 0.5s ease-in-out;
    -ms-transition: background-image 0.5s ease-in-out;
    -o-transition: background-image 0.5s ease-in-out;
    transition: background-image 0.5s ease-in-out;
}

JavaScript

var url1 = 'http://velocityagency.com/wp-content/uploads/2013/08/go.jpg';
var url2 = 'http://www.thesearchagents.com/wp-content/uploads/2013/11/Google-Search.jpg';
$(document).ready(function () {
    $('#img2').hover(function () {
        $(this).css("background-image", "url('" + url1 + "')");
    }, function () {
        $(this).css("background-image", "url('" + url2 + "')");
    })
})