jquery - User-rotatable elements in the browser -


i'm creating requires end user move objects around using mouse, change size , rotate object. of can achieved using jqueryui (here) except rotating. need user able rotate objects.

one option put slider adjusts css transform properties, if there's way in more intuitive way (a la powerpoint/photoshop) great.

is there way this?

http://jsfiddle.net/avpf6/1/ solution using drag able handle.

// original element var ele = $('#selector');  $('#selector').draggable({});  // create handle dynamically $('<div></div>').appendto(ele).attr('id','handle').css({ 'position': 'absolute', 'bottom': 5, 'right': 5, 'height': 10, 'width': 10, 'background-color': 'orange' });  ele.css('position', 'relative');  $('#handle').draggable({ handle: '#handle', opacity: 0.01,  helper: 'clone', drag: function(event, ui){     var rotatecss = 'rotate(' + ui.position.left + 'deg)';      $(this).parent().css({         '-moz-transform': rotatecss,         '-webkit-transform': rotatecss     }); } }); 

Comments

Popular posts from this blog

java - Run a .jar on Heroku -

java - Jtable duplicate Rows -

validation - How to pass paramaters like unix into windows batch file -