jQuery: on change style value

Question

Html code :

<div class="name" style="left:0%"></div>

I want if style of name class change , alert by jQuery

jQuery code:

$('.name').bind('style',function(){
    alert(1);
});

Answer 1

If you don't want to consider using MutationObserver you'll have to write more code. Something like this:

$(document).ready(function () {
    var colorsArr = ['red', 'orange', 'gray', 'black', 'blue', 'yellow'];
    $('#btnChangeBackgroundColor').on('click', function () {
    var xColor = colorsArr.shift();
    colorsArr.push(xColor);

    $('.name').css('background-color', xColor);
  });

    $('.name').attr('data-originalstyle', $('.name').attr('style'));

  checkIfStyleChanged();
});

function checkIfStyleChanged() {
    if ($('.name').attr('data-originalstyle') != $('.name').attr('style')) {
   $('.name').attr('data-originalstyle', $('.name').attr('style'));

    $('#lblChanged').html('The Style Changed');
    $('#lblChanged').css('display', '');

    setTimeout(function () {
        $('#lblChanged').fadeOut('slow');
    }, 1500);    
  }

  setTimeout(function () {
        checkIfStyleChanged();
    }, 50); 
}

See my jsfiddle example: https://jsfiddle.net/fictus/6zhqk4b1/