如何将通过javascript window.open函数打开的弹出窗口集中在屏幕中心变量上,使其达到当前选定的屏幕分辨率?

推荐答案

SINGLE/DUAL MONITOR FUNCTION(计入http://www.xtf.dk——谢谢!)

UPDATE: It will also work on windows that aren't maxed out to the screen's width and height now thanks to @Frost!

如果你在双显示器上,窗口将水平居中,但不是垂直居中...使用此函数可以解释这一点.

const popupCenter = ({url, title, w, h}) => {
    // Fixes dual-screen position                             Most browsers      Firefox
    const dualScreenLeft = window.screenLeft !==  undefined ? window.screenLeft : window.screenX;
    const dualScreenTop = window.screenTop !==  undefined   ? window.screenTop  : window.screenY;

    const width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
    const height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;

    const systemZoom = width / window.screen.availWidth;
    const left = (width - w) / 2 / systemZoom + dualScreenLeft
    const top = (height - h) / 2 / systemZoom + dualScreenTop
    const newWindow = window.open(url, title, 
      `
      scrollbars=yes,
      width=${w / systemZoom}, 
      height=${h / systemZoom}, 
      top=${top}, 
      left=${left}
      `
    )

    if (window.focus) newWindow.focus();
}

用法示例:

popupCenter({url: 'http://www.xtf.dk', title: 'xtf', w: 900, h: 500});  

CREDIT GOES TO: 100(我只是想链接到这个页面,但为了防止这个网站崩溃,代码在这里,所以,干杯!)

Javascript相关问答推荐

检测内部/部分组件内部的路由更改(Nuxt 2.14中的VueRoute 3)

如何使用JavaScript向html元素添加样式

如何使用JavaScript动态地将CSS应用于ToDo列表?

有条件的悲剧

jQuery提交按钮重新加载页面,即使在WordPress中使用preventDefault()

当试图显示小部件时,使用者会出现JavaScript错误.

如何在 cypress 中使用静态嵌套循环

如何通过使用vanilla JS限制字体大小增加或减少两次来改变字体大小

如何从网站www.example.com获取表与Cheerio谷歌应用程序脚本

使用GraphQL查询Uniswap的ETH价格

加载背景图像时同步旋转不显示的问题

使用ThreeJ渲染的形状具有抖动/模糊的边缘

Next.js服务器端组件请求,如何发送我的cookie token?

<;img>;标记无法呈现图像

如果一个字符串前面有点、空格或无字符串,后面有空格、连字符或无字符串,则匹配正则表达式

Google脚本数组映射函数横向输出

我想使用GAS和HTML将从Electron 表格中获得的信息插入到文本字段的初始值中

当从其他文件创建类实例时,为什么工作线程不工作?

用于部分字符串的JavaScript数组搜索

通过跳过某些元素的对象进行映射