वर्तमान स्क्रीन आकार प्रदर्शित करें - उत्तरदायी डिजाइन उपकरण

Question

मैं इस समय बहुत सारे उत्तरदायी डिजाइन विकास कर रहा हूं, जैसा कि सभी फ्रंट-एंड देव हैं।

एक चीज़ जो मुझे जानना अच्छा लगेगा वह सटीक वर्तमान स्क्रीन आकार है।

क्रोम यह है: https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh

मैं Firefox के साथ वर्तमान स्क्रीन आकार कैसे प्रदर्शित कर सकते हैं?

Answer 1

इसका एक बहुत पुराना सवाल है लेकिन उल्लेखनीय है।

फ़ायरफ़ॉक्स में अब "Responsive Design Mode" है जो किसी भी ब्राउज़र पर मैंने देखा है कि उत्तरदायी परीक्षण करने के लिए सबसे अच्छा है।

शॉर्टकट Cntrl+Shift+M है और आप अभी भी देव उपकरण खोलने में सक्षम होने के दौरान स्क्रीन के आकार पर पूर्ण नियंत्रण के साथ एक शानदार मोबाइल दृश्य में हैं।

अद्यतन - क्रोम उपकरण

इसकी किया गया इस जवाब के बाद से थोड़ी देर और के बाद से Firefox के मोबाइल विकास उपकरण एक पूरी सौदा नहीं बदला है, Google Chromes एक पूरी बहुत कुछ बदल गया है और कर रहे हैं है इतना शानदार यह मूर्खतापूर्ण प्रतीत होता है कि उन लोगों के लिए साझा न करें जो पहले से ही इसका इस्तेमाल नहीं कर चुके हैं।

मारो F12 तो यह खुल जाएगा, तो मोबाइल विकास उपकरण ऊपर लाने के लिए छोटे मोबाइल आइकन हिट:

इस मोबाइल देव उपकरण जो इस

की तरह लग रहा खुलेगा

यहां से आप सभी प्रकार की चीजें बदल सकते हैं, लेकिन प्री-डिफ़ाइंड डिवाइस और उपयोगकर्ता-एजेंटों के साथ स्वचालित रूप से आपके लिए सेट किए गए डिवाइसों के बीच आसानी से सेट कर सकते हैं।

अधिक से अधिक आप चीजों, स्पर्श, भू-स्थान आदि की तरह

Answer 2

इस FIDDLE

$(window).on('resize', showSize); 

showSize(); 

function showSize() { 
    $('#size').html('HEIGHT : '+$(window).height()+'<br>WIDTH : '+$(window).width()); 
    $('#size2').html('HEIGHT : '+screen.height+'<br>WIDTH : '+screen.width); 
} 
​ 

संपादित करना: रूप में अच्छी तरह स्क्रीन आकार कहा, उपयोग जो कुछ भी आप की जरूरत है!

Answer 3

आप इसे एक बुकमार्क के रूप में डाल सकते हैं। यह (उम्मीद है) क्रॉस ब्राउज़र काम करना चाहिए। इससे छुटकारा पाने के लिए डिस्प्ले पर क्लिक करें। http://jsfiddle.net/krWLA/8/

(function() { 
    var v=window,d=document; 
    v.onresize = function() { 
     var w = v.innerWidth ? v.innerWidth : 
       d.documentElement.clientWidth, 
      h = v.innerHeight ? v.innerHeight : 
       d.documentElement.clientHeight, 
      s = d.getElementById('WSzPlgIn'), 
      ss; 
     if (!s) { 
      s = d.createElement('div'); 
      s.id = 'WSzPlgIn'; 
      d.body.appendChild(s); 
      s.onclick = function() { 
       s.parentNode.removeChild(s) 
      }; 
      ss = s.style; 
      ss.position = 'absolute'; 
      ss.bottom = 0; 
      ss.right = 0; 
      ss.backgroundColor = 'black'; 
      ss.opacity = '.5'; 
      ss.color = 'white'; 
      ss.fontFamily = 'monospace'; 
      ss.fontSize = '10pt'; 
      ss.padding = '5px'; 
      ss.textAlign = 'right'; 
     } 
     s.innerHTML = 'w ' + w + '<br />h ' + h; 
    }; 
})()​