Bagaimanakah Saya Boleh Memusatkan Tetingkap Pop Timbul pada Skrin Menggunakan JavaScript?

Memusatkan Tetingkap Pop Timbul

Memusatkan tetingkap timbul pada skrin boleh dicapai menggunakan fungsi window.open JavaScript. Koordinat tepat (x dan y) di mana tetingkap akan muncul berbeza-beza berdasarkan peleraian skrin semasa.

Penyelesaian Merentas Platform

Penyelesaian berikut berfungsi untuk kedua-duanya persediaan tunggal dan dwi-monitor:

<code class="js">const popupCenter = ({ url, title, w, h }) => {
  // Adjust for dual-screen positions
  const dualScreenLeft = window.screenLeft || window.screenX;
  const dualScreenTop = window.screenTop || window.screenY;

  // Get the screen size
  const width = window.innerWidth || document.documentElement.clientWidth || screen.width;
  const height = window.innerHeight || document.documentElement.clientHeight || screen.height;

  // Calculate the scaling factor
  const systemZoom = width / window.screen.availWidth;

  // Calculate the window's position
  const left = (width - w) / 2 / systemZoom + dualScreenLeft;
  const top = (height - h) / 2 / systemZoom + dualScreenTop;

  // Open the popup window
  const newWindow = window.open(url, title, `
    scrollbars=yes,
    width=${w / systemZoom},
    height=${h / systemZoom},
    top=${top},
    left=${left}
  `);

  // Focus the new window
  if (window.focus) newWindow.focus();
};</code>

Contoh Penggunaan

<code class="js">popupCenter({
  url: 'http://www.xtf.dk',
  title: 'xtf',
  w: 900,
  h: 500,
});</code>

Kredit

Penyelesaian ini disesuaikan daripada http://www.xtf.dk/2011/08/center-new-popup-window-even-on.html.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memusatkan Tetingkap Pop Timbul pada Skrin Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!