2009-08-14 69 views
6

有誰知道如何在用戶捏住或雙擊以在JavaScript頁面上放大/縮小頁面之後獲取視圖的大小(像素或縮放比例值)?如何在捏放/放大iPhone web應用程序後獲得視口縮放比例?

我試過使用window.innerWidth,但我有混合結果。有時,它似乎準確地給出了視口顯示的像素數量,但是,如果我在頁面上放大圖像然後進行大範圍縮放以返回縮放,則window.innerWidth將在600-700左右,即使它只是顯示約200px的網頁。該頁面只有400px寬,並且沒有顯示當您縮小超出頁面大小時所看到的格子「您已經走得太遠」的背景。

如果我做小捏來放大和縮小,window.innerWidth似乎工作就好了。不幸的是,我不能依靠一個用戶只做小捏手勢:)

我也嘗試使用手勢事件對象的scale屬性,但我發現不可靠的,因爲你並不總是知道當您重新加載頁面時的初始縮放或使用後退/前進按鈕導航到它,即使使用元標記指定它時也是如此。

最終,我試圖讓一個應用程序,知道當用戶試圖縮小超出最大縮放級別,所以如果有另一種方式來做到這一點,我很感興趣,聽說它的:)

下面的代碼我用得到innerWidth:

document.body.addEventListener('gestureend', function (evt) { 
    console.log(window.innerWidth); // inaccurate when doing large pinch gestures 
}, false); 

謝謝!

回答

2

如果你只是想限制最大縮放級別,您可以使用Safari瀏覽器,具體視控制標籤:

<meta name="viewport" content="maximum-scale=2.0"> 

見的Safari移動專用viewport meta tag spec瞭解詳情。