JSFiddle - React, Tailwind, and code Playground

by trejder

HTML

<div class="spinner-large">
    Something
</div>

<button id="clickme">Click me!</button>

CSS

.spinner-large
{
    width: 400px;
    height: 200px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAUCAYAAAC07qxWAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sGDhMIDXO6L0MAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRoIEdJTVBXgQ4XAAAAkElEQVQoz+2RMVZEMQwDZ0Tuf9blAKwonB92H80vKHEVK4osObYtN2o9Ph8A+EIv4NU4wIr5Afh1PMBKMk8q9Qgge0SllqUCgZR0rrPZBbTUsJKPrVIUyiVbZpZEWYnbhu/+fO/H44550raHeG1hUluK6KypKe44J9zz69lx+LoORxVQaYt3fybcrH/i3xC/AS6eOjFBI6K/AAAAAElFTkSuQmCC);
}

JavaScript

function showSpinner()
{
    var
        spinner = $('.spinner-large'),
        spinnerBackgroundImage = spinner.css('background-image');

    console.log(spinnerBackgroundImage);
    console.log($('.spinner-large').css('background-image'));

    spinner.css('background-image', spinnerBackgroundImage);

    console.log(spinner.css('background-image'));
}

$('#clickme').on('click', function(){showSpinner()});

$(window).on('beforeunload', function(){showSpinner();});