chia tỷ lệ hình ảnh trên cử chỉ chụm

Question

Tôi đang sử dụng plugin jQuery touchy để phát hiện sự kiện pinch để cung cấp cho người dùng khả năng phóng to/thu nhỏ hình ảnh. Dưới đây là các ý chính của mã của tôi:

 
var w = 800, 
    h = 600; 
$('img').on('touchy-pinch', function (e, $target, data) { 
    $(this).css({ 
     width: w * data.scale, 
     height: h * data.scale 
    }); 
}); 

Trường hợp đối tượng dữ liệu tùy chỉnh chứa sau:

• quy mô
• previousScale
• currentPoint
• StartPoint
• startDistance

Nó hoạt động tốt trên pinch đầu tiên, nhưng một khi ngón tay của tôi rời khỏi màn hình và sau đó tôi cố gắng làm điều đó một lần nữa, hình ảnh lại quy mô trở lại. Làm thế nào tôi có thể sửa đổi xử lý của tôi để hình ảnh tiếp tục ở nơi nó rời đi thay vì tái quy mô? Sử dụng previousScale của dữ liệu đã không giúp đỡ vì các previousScale chỉ được thiết lập lại là tốt.

Answer 1

Vấn đề ở đây là bạn không đặt lại các giá trị w và h của bạn thành giá trị sau khi được chia tỷ lệ, chỉ là css, do đó, kiểu trở lại 800x600 trên một sự kiện tỷ lệ khác. Bạn cần một w và h liên tục được đặt thành w*data.scale và h*data.scale trên sự kiện tỷ lệ.