تحديد حجم المشاهدة الفعلي في المتصفح

Question

أحاول تحديد حجم منفذ العرض الفعلي لنافذة المتصفح الحالية. لقد حاولت:

• window.innerheight/innerwidth
• document.documentElement.clientheight/clientwidth
• document.body.clientheight/clientwidth

جميع إرجاع حجم الصفحة الكاملة وليس منطقة المشاهدة.

ما أحاول تحقيقه في النهاية هو إجبار قائمة منبثقة على الظهور على الشاشة (في منفذ العرض). في الوقت الحالي عندما يتم عرضه ، قد يظهر أسفل التمرير والمستخدمين غير راضين عن ذلك. أنا أعرف x ، y من حيث نقرت. أنا فقط بحاجة إلى مقارنة ذلك بحجم منطقة المشاهدة (بحجم المنبثقة) لمعرفة ما إذا كان سيذهب خارج الشاشة.

تجدر الإشارة إلى أن الصفحة تظهر في iframe ، لذلك إذا كنت بحاجة إلى ارتداء مستوى واحد للحصول على القيمة الصحيحة ، يمكنني القيام بذلك.

Answer 1

على ما يبدو من خلال الذهاب إلى المستند الأم ، تمكنت من الحصول على القيمة الصحيحة.

شكرًا!

Answer 2

• window.innerheight/innerwidth

أن لا لبس فيه يفعل امنحك حجم المنفذ (في هذه الحالة ، الحجم داخل iframe الخاص بك) ، لكنه غير متوفر على IE.

• document.documentElement.clientheight/clientwidth

يمنحك هذا حجم المنفذ ، عندما يكون المتصفح في وضع المعايير. عادة ما تستخدم كاحتفال ل IE.

• document.body.clientheight/clientwidth

الذي يمنحك ارتفاع المنفذ في وضع المراوغات. لا تريد أن تكون في وضع المراوغات. افحص ال <!DOCTYPE من المستند الخاص بك.

أنا فقط بحاجة إلى مقارنة ذلك بحجم منطقة المشاهدة

ثم عليك أيضًا النظر إلى document.documentElement.scrollTop/scrollLeft.

Answer 3

محاولة

document.getElementById("").offsetWidth

املأ الكود أعلاه مع معرف العناصر المختلفة ، حاول استخدام علامة الجسم ، أو Wrapper Div.