jquery resizable not working properly at 90 and 270 angles

I'm using jquery resizable plugin to resize elements using resizable handles but it doesn't working after rotating element.

resizable handles and its subsequent resize operations not working properly after rotation exactly at 90 and 270 degrees because resizable not aware of rotation angle.

In following code i just find the rotation angle and changed handles direction according to rotation angle but it doesn't working properly at 90 and 270 due to height and width problem i tried to fix but i couldn't,help me

    $('#screenlayer_'+count+ ' .polaroid').resizable({
    handles:'se, sw, ne, nw',
    zIndex : 10000,
    delay: 0,
    create:function() {

    },
    start:function(event, ui){


    },  //start:function(event, ui)
    resize:function(event, ui){
                       var matrix = $(this).css("-webkit-transform") ||
      $(this).css("-moz-transform")    ||
      $(this).css("-ms-transform")     ||
      $(this).css("-o-transform")      ||
      $(this).css("transform");
      if(matrix !== 'none') {
          var values = matrix.split('(')[1].split(')')[0].split(',');
          var a = values[0];
          var b = values[1];
          var angle = Math.round(Math.atan2(b, a) * (180/Math.PI));
      } 
      else { 
          var angle = 0; 
      }
      if(angle < 0) 
          angle +=360;

        console.log(angle)

         if((angle >= 0 && angle  < 45 ) || (angle < 361 && angle >= 315))
      {
          $(this).parent().find('.ui-resizable-sw').css({
              'bottom':'-10px','left':'-10px','top':'','right':''
          });
          $(this).parent().find('.ui-resizable-nw').css({
              'top':'-10px','left':'-10px','bottom':'','right':''
          });
          $(this).parent().find('.ui-resizable-se').css({
              'bottom':'-10px','right':'-10px','top':'','left':''
          });
          $(this).parent().find('.ui-resizable-ne').css({
              'top':'-10px','right':'-10px','bottom':'','left':''
          });
      }
      else if(angle >= 45 && angle < 135)
      {
          $(this).parent().find('.ui-resizable-nw').css({
              'bottom':'-10px','left':'-10px','top':'','right':''
          });
          $(this).parent().find('.ui-resizable-sw').css({
              'bottom':'-10px','right':'-10px','top':'','left':''
          });
          $(this).parent().find('.ui-resizable-ne').css({
              'top':'-10px','left':'-10px','bottom':'','right':''
          });
          $(this).parent().find('.ui-resizable-se').css({
              'top':'-10px','right':'-10px','left':'','bottom':''
          });   
      }
      else if(angle >=135 && angle < 225)
      {
          $(this).parent().find('.ui-resizable-ne').css({
              'bottom': '-10px','left':'-10px','top':'','right':''
          });
          $(this).parent().find('.ui-resizable-nw').css({
              'bottom': '-10px','right':'-10px','top':'','left':''
          });
          $(this).parent().find('.ui-resizable-se').css({
              'top': '-10px','left':'-10px','bottom':'','right':''
          });
          $(this).parent().find('.ui-resizable-sw').css({
              'top': '-10px','right':'-10px','left':'','bottom':''
          });               
      }
      else if(angle >=225 && angle < 315)
      {
          $(this).parent().find('.ui-resizable-se').css({
              'bottom':'-10px','left':'-10px','top':'','right':''
          });
          $(this).parent().find('.ui-resizable-ne').css({
              'bottom':'-10px','right':'-10px','top':'','left':''
          });
          $(this).parent().find('.ui-resizable-sw').css({
              'top': '-10px','left': '-10px','bottom':'','right':''
          });
          $(this).parent().find('.ui-resizable-nw').css({
              'top':'-10px','right':'-10px','left':'','bottom':''
          });   

      }


    },
    stop:function(event , ui) 
    {


    }
}); 

appreciating any help,Thanks.