फोनगैप/JQuery मोबाइल में डिवाइस-चौड़ाई को प्रोग्रामेटिक रूप से कैसे ढूंढें

Question

मुझे मोबाइल डिवाइस की डिवाइस-चौड़ाई खोजने की आवश्यकता है। हम सामग्री

<meta name="viewport" content="width=device-width; user-scalable=no" /> 

निर्दिष्ट कर सकते हैं लेकिन मैं प्रोग्राम के रूप में अपने आवेदन में कुछ तर्क गणना करने के लिए डिवाइस चौड़ाई प्राप्त करने की आवश्यकता हालांकि। मैं डिवाइस की चौड़ाई कैसे प्राप्त कर सकता हूं?

Answer 1

viewport आयाम window वस्तु के माध्यम से इकट्ठा किया जा सकता:

var viewport = { 
    width : $(window).width(), 
    height : $(window).height() 
}; 

//can access dimensions like this: 
//viewport.height 

हालांकि आप हमेशा सही परिणाम प्राप्त नहीं होगा, विभिन्न उपकरणों के अलग तरीके से व्यवहार करते हैं और इस viewport आयाम, न कि स्क्रीन आयाम देता है।

वैकल्पिक रूप से आप को खोजने के लिए एक data-role="page" तत्व की चौड़ाई की जांच कर सकता device-width (क्योंकि यह device-width की 100% पर सेट है):

var deviceWidth = 0; 
$(window).bind('resize', function() { 
    deviceWidth = $('[data-role="page"]').first().width(); 
}).trigger('resize');​​​ 

Answer 2

सुनिश्चित नहीं हैं कि समाधान प्रस्तावित काम करता है के रूप में उम्मीद। क्या आप वाकई असली डिवाइस-चौड़ाई प्राप्त कर रहे हैं?

मैं अपने एप्लिकेशन में निम्न कोड का उपयोग कर रहा है और यह ठीक काम करता है:

function effectiveDeviceWidth() { 
    var deviceWidth = window.orientation == 0 ? window.screen.width : window.screen.height; 
    // iOS returns available pixels, Android returns pixels/pixel ratio 
    // http://www.quirksmode.org/blog/archives/2012/07/more_about_devi.html 
    if (navigator.userAgent.indexOf('Android') >= 0 && window.devicePixelRatio) { 
     deviceWidth = deviceWidth/window.devicePixelRatio; 
    } 
    return deviceWidth; 
} 

आशा है कि यह किसी की मदद कर सकते हैं! `$ ('# प्लेसहोल्डर')) चौड़ाई ($ (खिड़की: