Clever Geek Handbook

How can I zoom pinchIn / pinchOut in jQuery Mobile?

I wrote events. I don't understand how to make pinchIn pinchOut programmatically. Please help me. And I am using the TouchSwipe plugin. I tried:

pinchIn: function(event, direction, distance, duration, fingerCount, pinchZoom) {
    console.log('pinchIn');
    $(this).css('zoom','1.5');        
},
pinchOut:function(event, direction, distance, duration, fingerCount, pinchZoom) {
    $(this).css('zoom','1.0');
    console.log('pinchOut');         
},
+3


source to share


1 answer


This is because you are setting the css () function to increment the static sum every time. You have to add some kind of increment each time the event is fired, so you increment "more" each time. Here's a really simple example of what I mean:

http://jsfiddle.net/x4gkoeos/



So for example

var pinchAmount = 0; // not sure what you'd set this to for your use case

pinchIn: function(event, direction, distance, duration, fingerCount, pinchZoom) {
    console.log('pinchIn');
    $(this).css('zoom', pinchAmount);    
    pinchAmount = pinchAmount + 1 // Or whatever you want the increment to be, I'm guessing 1
}
+1


source






More articles:


All Articles