Center a popup window on screen?

前端 未结 18 1029
一整个雨季
一整个雨季 2020-11-22 16:51

How can we center a popup window opened via javascript window.open function on the center of screen variable to the currently selected screen resolution ?

18条回答
  •  遥遥无期
    2020-11-22 17:43

    Here is an alternate version of the aforementioned solution...

    const openPopupCenter = (url, title, w, h) => {
      const getSpecs = (w, h, top, left) => {
        return `scrollbars=yes, width=${w}, height=${h}, top=${top}, left=${left}`;
      };
    
      const getFirstNumber = (potentialNumbers) => {
        for(let i = 0; i < potentialNumbers.length; i++) {
          const value = potentialNumbers[i];
    
          if (typeof value === 'number') {
            return value;
          }
        }
      };
    
      // Fixes dual-screen position
      // Most browsers use window.screenLeft
      // Firefox uses screen.left
      const dualScreenLeft = getFirstNumber([window.screenLeft, screen.left]);
      const dualScreenTop = getFirstNumber([window.screenTop, screen.top]);
      const width = getFirstNumber([window.innerWidth, document.documentElement.clientWidth, screen.width]);
      const height = getFirstNumber([window.innerHeight, document.documentElement.clientHeight, screen.height]);
      const left = ((width / 2) - (w / 2)) + dualScreenLeft;
      const top = ((height / 2) - (h / 2)) + dualScreenTop;
      const newWindow = window.open(url, title, getSpecs(w, h, top, left));
    
      // Puts focus on the newWindow
      if (window.focus) {
        newWindow.focus();
      }
    
      return newWindow;
    }
    

提交回复
热议问题