কীভাবে জাভাস্ক্রিপ্ট দিয়ে স্ক্রিন রেজোলিউশন সনাক্ত করবেন?

Question

এমন কোনও উপায় আছে যা সমস্ত ব্রাউজারের জন্য কাজ করে?

Answer 1

মূল উত্তর

হ্যাঁ.

window.screen.availHeight
window.screen.availWidth

আপডেট 2017-11-10

মন্তব্যগুলিতে সুনামিস থেকে :

নেটিভ রেজোলিউশন অর্থাত্ একটি মোবাইল ডিভাইস পেতে আপনাকে ডিভাইস পিক্সেল অনুপাত: window.screen.width * window.devicePixelRatioএবং দিয়ে গুণ করতে হবে window.screen.height * window.devicePixelRatio। এটি ডেস্কটপগুলিতেও কাজ করবে, যার অনুপাত 1 হবে।

এবং বেন থেকে অন্য উত্তর:

ভ্যানিলা জাভাস্ক্রিপ্টে এটি আপনাকে উপলভ্য প্রস্থ / উচ্চতা দেবে:

window.screen.availHeight
window.screen.availWidth

পরম প্রস্থ / উচ্চতার জন্য, ব্যবহার করুন:

window.screen.height
window.screen.width

Comments

এটি এখন বেশ সঠিক নয়। এটি পৃষ্ঠা জুমের সম্ভাব্য পরিবর্তন বিবেচনা করে না।

— সার্জজাচ

@sergzach - সেক্ষেত্রে আমি jQuery এর $(window).width()পরিবর্তে ব্যবহার করব , চেইম.দেবের উত্তর দেখুন

— বার্নটোকোড

সঠিক স্ক্রিনের আকার পেতে পরবর্তী উইন্ডো.স্ক্রিন.হাইট এবং উইন্ডো.স্ক্রিন.উইথথ (পরবর্তী উত্তরে প্রস্তাবিত হিসাবে) ব্যবহার করুন। কারণ আপনি সঠিক আকার পাচ্ছে না এটি উপলব্ধ প্রস্থ ও উচ্চতা চেক এর মানে হল এই যে এটা টুলবার উচ্চতা বিয়োগ হবে (যা ঠিক 40px জানালা হয় 7/8)

— Jaruba

উইন্ডো.স্ক্রিন.হাইট এবং প্রস্থের সাথে স্ক্রিন রেজোলিউশনের জন্য আরও ভাল হবে না? কেন হাইট? আমার availWidth উদাহরণস্বরূপ, 1050 ফিরে আসবে, যখন এটি

— আসল

@ গুণাবলী আপনাকে গুন করতে হবে window.devicePixelRatio। আলেসান্দ্রোসের উত্তর সম্পর্কে আমার মন্তব্য দেখুন to

— সুনামিস

Answer 2

var width = screen.width;
var height = screen.height;

Comments

এটি সমান window.screen। এটি কেবল বিদ্যমান উত্তরের সাথে যুক্ত করা উচিত।

— গাজুস

আসলে এটিই সঠিক উত্তর। screen.availHeightকেবলমাত্র ব্রাউজার উইন্ডোতে উপলব্ধ উচ্চতা screen.heightদেয় যখন পর্দার সঠিক উচ্চতা দেয়।

— অপারভ

এটি ডিপিআই স্কেলযুক্ত রেজোলিউশন দেয়, নেটিভ স্ক্রিন রেজোলিউশন নয়।

— ডমিনিক সেরিসানো

নেটিভ রেজোলিউশন অর্থাত্ একটি মোবাইল ডিভাইস পেতে আপনাকে ডিভাইস পিক্সেল অনুপাত: window.screen.width * window.devicePixelRatioএবং দিয়ে গুণ করতে হবে window.screen.height * window.devicePixelRatio। এটি ডেস্কটপগুলিতেও কাজ করবে, যার অনুপাত 1 টি হবে

— সুনামিস

ডেস্কটপ কম্পিউটারগুলির অগত্যা

— 21

Answer 3

ভ্যানিলা জাভাস্ক্রিপ্টে এটি আপনাকে উপলভ্য প্রস্থ / উচ্চতা দেবে:

window.screen.availHeight
window.screen.availWidth

পরম প্রস্থ / উচ্চতার জন্য, ব্যবহার করুন:

window.screen.height
window.screen.width

উপরের দুটিই উইন্ডো উপসর্গ ছাড়া লেখা যেতে পারে।

JQuery পছন্দ? এটি সমস্ত ব্রাউজারে কাজ করে তবে প্রতিটি ব্রাউজার বিভিন্ন মান দেয়।

$(window).width()
$(window).height()

Answer 4

আপনি কি বোঝাতে চাইছেন ডিসপ্লে রেজোলিউশন (যেমন প্রতি ইঞ্চিতে 72 ডট) বা পিক্সেল মাত্রা (ব্রাউজার উইন্ডোটি বর্তমানে 1000 x 800 পিক্সেল)?

স্ক্রিন রেজোলিউশন আপনাকে 10 পিক্সেলের লাইন ইঞ্চি কতটা পুরু হবে তা জানতে সক্ষম করে। পিক্সেল মাত্রা আপনাকে জানায় যে উপলব্ধ পর্দার উচ্চতার কত শতাংশ 10 পিক্সেল প্রশস্ত অনুভূমিক রেখা দ্বারা নেওয়া হবে।

কেবল জাভাস্ক্রিপ্ট থেকে ডিসপ্লে রেজোলিউশনটি জানার কোনও উপায় নেই কারণ কম্পিউটার নিজেই সাধারণত পর্দার আসল মাত্রাগুলি, পিক্সেলের সংখ্যা জানতে পারে না। 72 ডিপিআই হ'ল স্বাভাবিক অনুমান ....

লক্ষ্য করুন যে ডিসপ্লে রেজোলিউশন সম্পর্কে অনেক বিভ্রান্তি রয়েছে, প্রায়শই লোকেরা পিক্সেল রেজোলিউশনের পরিবর্তে শব্দটি ব্যবহার করে তবে দুটি বেশ আলাদা are উইকিপিডিয়া দেখুন

অবশ্যই, আপনি প্রতি সেমি বিন্দুগুলিতে রেজোলিউশনও পরিমাপ করতে পারেন। বর্গক্ষেত্র বিন্দুর অস্পষ্ট বিষয়ও রয়েছে। কিন্তু আমার দ্বিমত আছে.

Answer 5

JQuery ব্যবহার করে আপনি করতে পারেন:

$(window).width()
$(window).height()

Comments

এটি আমি ব্যবহার করেছি সবচেয়ে সহজ ক্রস / সমস্ত সমাধান। কমপক্ষে ব্রাউজারের প্রস্থের জন্য ...

— জার্ন দ্রাভিটস্কি

এটি উইন্ডোর আকারটি দেয়, পর্দার রেজোলিউশনটি দেয় না।

— জোনাস

Answer 6

আপনি ব্রাউজারের সরঞ্জামদণ্ডগুলি এবং ... (কেবল পর্দার আকার নয়) এড়িয়ে উইন্ডো প্রস্থ এবং উচ্চতাও পেতে পারেন।

এটি করতে, ব্যবহার করুন: window.innerWidth এবং window.innerHeightবৈশিষ্ট্যগুলি। এটি ডাব্লু 3 স্কুলগুলিতে দেখুন ।

বেশিরভাগ ক্ষেত্রে এটি সর্বোত্তম উপায় হবে, উদাহরণস্বরূপ, পুরোপুরি কেন্দ্রিক ভাসমান মডেল ডায়ালগটি প্রদর্শন করা। এটি আপনাকে উইন্ডোতে অবস্থানগুলি গণনা করতে দেয়, কোনও রেজোলিউশন ওরিয়েন্টেশন বা উইন্ডো আকার ব্রাউজারটি ব্যবহার করছে তা বিবেচনা করে না।

Comments

এটি সবচেয়ে কার্যকর সমাধান। উইন্ডো.স্ক্রিন.ওয়ায়েলউইথ প্রস্থ বৈশিষ্ট্যটি স্ক্রিন দেয়, ভিউপোর্টটি নয়, যা আলাদা হতে পারে। ব্রাউজারের সর্বোচ্চ কী হতে পারে / কী হতে পারে তা নয়, আমি আসলে কতটা রিয়েল এস্টেট ব্যবহার করতে পারি তা আমার পক্ষে আরও দরকারী।

— মাইক মান্নাকি

Answer 7

এটি একটি মোবাইল ডিভাইসে পাওয়ার চেষ্টা করার জন্য আরও কয়েকটি পদক্ষেপ প্রয়োজন। screen.availWidthডিভাইসের ওরিয়েন্টেশন নির্বিশেষে একই থাকে।

মোবাইলের জন্য আমার সমাধানটি এখানে:

function getOrientation(){
    return Math.abs(window.orientation) - 90 == 0 ? "landscape" : "portrait";
};
function getMobileWidth(){
    return getOrientation() == "landscape" ? screen.availHeight : screen.availWidth;
};
function getMobileHeight(){
    return getOrientation() == "landscape" ? screen.availWidth : screen.availHeight;
};

Comments

window.orientationঅপরিবর্তিত ... (ফায়ারফক্স 49) screen.orientation.angleপ্রত্যাবর্তন করে একটি কোণ, তবে ল্যান্ডস্কেপ মোডের জন্য এটি ইতিমধ্যে 0 এ।

— লাম্বার্ট

Answer 8

দেখুন জাভাস্ক্রিপ্ট সঙ্গে মনিটর স্ক্রিন রেজোলিউশন পান এবং window.screenবস্তুর

Answer 9

function getScreenWidth()
{
   var de = document.body.parentNode;
   var db = document.body;
   if(window.opera)return db.clientWidth;
   if (document.compatMode=='CSS1Compat') return de.clientWidth;
   else return db.clientWidth;
}

Answer 10

কেবল ভবিষ্যতের রেফারেন্সের জন্য:

function getscreenresolution()
{
    window.alert("Your screen resolution is: " + screen.height + 'x' + screen.width);
}

Answer 11

আপনি যদি স্ক্রিন রেজোলিউশন সনাক্ত করতে চান তবে আপনি প্লাগইন রেজোল্ট চেকআউট করতে চাইতে পারেন । এটি আপনাকে নিম্নলিখিতগুলি করতে অনুমতি দেয়:

var res = require('res')
res.dppx() // 1
res.dpi() // 96
res.dpcm() // 37.79527559055118

প্লাগইনটির লেখক রায়ান ভ্যান এটেনের কিছু দুর্দান্ত রেজোলিউশন গ্রহণের জন্য এখানে রয়েছে :

• 2 ইউনিট সেটগুলি একটি নির্দিষ্ট স্কেলে পৃথক থাকে এবং পৃথক হয়: ডিভাইস ইউনিট এবং সিএসএস ইউনিট।
• রেজোলিউশনটি বিন্দুর সংখ্যা হিসাবে গণনা করা হয় যা কোনও নির্দিষ্ট সিএসএস দৈর্ঘ্যের সাথে মাপসই করতে পারে।
• ইউনিট রূপান্তর: 1⁢in = 2.54⁢ সেমি = 96⁢px = 72⁢pt
• সিএসএসের আপেক্ষিক এবং পরম দৈর্ঘ্য রয়েছে। সাধারণ জুমে: 1⁢em = 16⁢px
• ডিপিপিএক্স ডিভাইস-পিক্সেল-অনুপাতের সমান।
• ডিভাইসপিক্সেলরটির সংজ্ঞা প্ল্যাটফর্মের দ্বারা পৃথক হয়।
• মিডিয়া প্রশ্নগুলি ন্যূনতম-রেজোলিউশনকে লক্ষ্য করতে পারে। গতির যত্ন সহকারে ব্যবহার করুন।

আজকের মতো, এখানে পুনর্নির্মাণের উত্স কোডটি এখানে রয়েছে:

!function(root, name, make) {
  if (typeof module != 'undefined' && module.exports) module.exports = make()
  else root[name] = make()
}(this, 'res', function() {

  var one = {dpi: 96, dpcm: 96 / 2.54}

  function ie() {
    return Math.sqrt(screen.deviceXDPI * screen.deviceYDPI) / one.dpi
  }

  function dppx() {
    // devicePixelRatio: Webkit (Chrome/Android/Safari), Opera (Presto 2.8+), FF 18+
    return typeof window == 'undefined' ? 0 : +window.devicePixelRatio || ie() || 0
  }

  function dpcm() {
    return dppx() * one.dpcm
  }

  function dpi() {
    return dppx() * one.dpi
  }

  return {'dppx': dppx, 'dpi': dpi, 'dpcm': dpcm}
});