Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Mendapatkan Dimensi Skrin, Halaman Web dan Tetingkap Penyemak Imbas Merentas Pelayar Berbeza?

Bagaimanakah Saya Boleh Mendapatkan Dimensi Skrin, Halaman Web dan Tetingkap Penyemak Imbas Merentas Pelayar Berbeza?

Patricia Arquette
Patricia Arquetteasal
2024-12-19 01:45:09171semak imbas

How Can I Get Screen, Web Page, and Browser Window Dimensions Across Different Browsers?

Mendapatkan Dimensi Skrin, Halaman Web dan Tetingkap Penyemak Imbas Merentasi Penyemak Imbas Utama

Untuk menangkap dimensi pelbagai elemen skrin dan tetingkap dalam semua utama pelayar, pertimbangkan untuk menggunakan teknik berikut:

Skrin Semasa Dimensi

Akses objek skrin untuk mendapatkan semula lebar dan ketinggian skrin:

window.screen.height;
window.screen.width;

Dimensi Halaman Web Semasa

Untuk saiz dokumen HTML, gunakan jQuery:

// Size of HTML document (similar to pageHeight/pageWidth)
$(document).height();
$(document).width();

Dimensi Tetingkap Penyemak Imbas

jQuery juga boleh mendapatkan semula dimensi tetingkap penyemak imbas:

// Size of browser viewport
$(window).height();
$(window).width();

Pengiraan Legasi

Untuk pelayar lama, adalah perkara biasa untuk menggunakan gabungan sifat tetingkap dan dokumen untuk mendapatkan dimensi:

windowHeight = window.innerHeight || document.documentElement.clientHeight;
windowWidth = window.innerWidth || document.documentElement.clientWidth;
pageHeight = document.body.scrollHeight;
pageWidth = document.body.scrollWidth;
pageX = window.pageXOffset || document.documentElement.scrollLeft;
pageY = window.pageYOffset || document.documentElement.scrollTop;
screenHeight = window.screen.availHeight || window.screen.height;
screenWidth = window.screen.availWidth || window.screen.width;
screenX = window.screen.availLeft || window.screen.x;
screenY = window.screen.availTop || window.screen.y;

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mendapatkan Dimensi Skrin, Halaman Web dan Tetingkap Penyemak Imbas Merentas Pelayar Berbeza?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn