CODEWITHSUNDEEP
javascriptjqueryimage
Mirza Talat
Mirza Talat

Reputation: 25

Rotation of object (using its images) on button click using javascript/jquery

I am currently using Jquery Plugin for showing the rotation of any object using the objects images(images are captured from every angle).rotation is working fine on mouse click.The thing is i want to make rotation possible with the help of buttons(i.e.,Left ,right,top,down buttons) .On clicking left button the images must show the rotation clockwise or left direction and vice-versa.Can you help me with this please

I have try following code :

$(function(){ 
      $('#image').reel({ 
          frames: 20, 
          frame: 14, 
          footage: 10, 
          rows: 13, 
          row: 8, 
          cw: true, 
          inversed: false, 
          speed: 0, 
          images: 'Drilbit/Drilbit_normal_###.png',
          cursor: 'move', 
          preloader: 3, 
          draggable: true, 
          wheelable: true, 
          throwable: true, 
        //steppable:true, 
     }); 
});

Upvotes: 1

Views: 1134

Answers (1)

Matous Michalik
Matous Michalik

Reputation: 26

In reel plugin documentation is described in this (annotated source code) process.

Triggering stepRight, stepLeft Events on reel object performs adequate actions. You should bind this Event calls to your control buttons.

$(function(){ 
    var reelObject = $('#image').reel({ 
        //required options
        steppable:true 
    }); 

    $('#button-right').click(function (){
        reelObject.trigger('stepRight');
    })

    $('#button-left').click(function (){
        reelObject.trigger('stepLeft');
    })
});

The same idea can be used for up/down events.

here is jsFiddle with demonstration.

//edit: added jsFidle for demonstration.

Upvotes: 1

Related Questions