jQuery Mobile 可以輕松地為手機和平板電腦創建響應式設計的應用程序。其中一個最流行的手勢是“pinch”，通過它我們可以縮放屏幕中的圖片，地圖和其他元素。下面是如何使用 jQuery Mobile pinch 手勢的一些例子。

$('img').on('pinchout', function(){
// 放大圖片
});
$('img').on('pinchin', function(){
// 縮小圖片
});
$('img').on('pinchend', function(){
// 手指離開圖片后的操作
});

上述代碼片段中的三個事件分別表示“捏開”、“捏緊”和“捏合結束”。通過在圖片上同時按下兩個手指并移動它們來模擬縮放手勢。同時還可以使用以下選項更改相應的閾值：

$.event.special.pinch.threshold = 0.2; // 可自定義的縮放閾值（從0到1）。

對于地圖，我們可以使用各種庫，如 Google Maps 和 OpenLayers。下面是使用 Google Maps 和 pinch 縮放的示例：

var map;
function initialize() {
var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(-34.397, 150.644)
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
// 借助jQuery Mobile的pinch事件，縮放地圖
$('#map-canvas').on('pinchout', function(){
map.setZoom(map.getZoom()+1);
});
$('#map-canvas').on('pinchin', function(){
map.setZoom(map.getZoom()-1);
});
}
google.maps.event.addDomListener(window, 'load', initialize);

上述代碼片段將允許您縮放 Google Map，當您在其中捏合手指時，地圖將縮放。

除了這些還有很多的使用 pinch 手勢的其他應用場景。通過學習和實踐，您可以創建出令人驚嘆的響應式應用程序。