JSFiddle - React, Tailwind, and code Playground
HTML
<div id="model"></div>
CSS
#model{position:relative;left:0;top:0;width:50px;height:50px;background:red;transition:left 1s, top 1s}
#model.on{left:100px;top:100px}
JavaScript
$('#model').on('click', function(){
var $modelEle = $(this);
var currentPos = $modelEle.offset().left;
var isOff = !$modelEle.hasClass('on');
// move - 이동을 위한 함수
function _move() {
$modelEle.addClass('on');
}
// _alert - 이동이 불가능한 경우 알림을 위한 함수
function _alert() {
alert('이미 이동되었습니다.')
}
if(isOff) {
_move();
}else{
_alert();
}
});