JSFiddle - React, Tailwind, and code Playground

by Alexander

HTML

<div id="box" style="width:30px;height:30px;background-color:purple"></div>

JavaScript

// Создаем кастомное CSS свойство "rotate":
$.cssHooks["rotate"] = {
    // Сеттер - устанавливает значение
    set: function(elem, value){
        $(elem).css('transform', 'rotate(' + parseInt(value, 10) + 'deg)');
    },
    // Геттер - возвращает вычисленное значение после рендеринга
    get: function( elem, computed, extra ) {
        var transform = $.css(elem, 'transform') || '', // this will return a
            parts = transform.match(/([\d\.\-]+(?:px)?)/g);
        if(!parts || !parts.length || parts.length != 6) return 0;
        return Math.round(Math.atan2(parts[1], parts[0]) * (180/Math.PI));
    }
};
 
// Пример использования
$('#box').css({ rotate: 20 });