Question

如何以全屏模式自动打开网页？

我正在寻找一种在全屏模式下自动打开网页的解决方案，而不希望用户按下F11或任何其他特定于浏览器的密钥。

我搜索了很多，但我找不到解决方案。

是否有可用于帮助我实现此目的的脚本或库或浏览器特定的API？

Answer 1

请注意，由于（Chrome）安全原因无法自动调用或执行，因此必须首先与用户进行交互。 （例如按钮点击，keydown /按键等）

addEventListener("click", function() {
    var
          el = document.documentElement
        , rfs =
               el.requestFullScreen
            || el.webkitRequestFullScreen
            || el.mozRequestFullScreen
    ;
    rfs.call(el);
});

demo来自David Walsh的Javascript Fullscreen API似乎是一个跨浏览器的解决方案

// Find the right method, call on correct element
function launchFullScreen(element) {
  if(element.requestFullScreen) {
    element.requestFullScreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullScreen) {
    element.webkitRequestFullScreen();
  }
}

// Launch fullscreen for browsers that support it!
launchFullScreen(document.documentElement); // the whole page
launchFullScreen(document.getElementById("videoElement")); // any individual element

Answer 2

仅适用于IE：

window.open ("mapage.html","","fullscreen=yes");  
window.open('','_parent','');  
window.close();

Answer 3

最好自己尝试模拟一个webbrowser。你不必坚持使用Chrome或IE或其他东西。

如果您使用的是Python，可以尝试使用pyQt4软件包来帮助您模拟Web浏览器。通过这样做，没有任何安全原因，您可以将webbrowser设置为自动以全屏模式显示。

Answer 4

查看大尺寸页面（函数（）{ var viewFullScreen = document.getElementById（“ view-fullscreen”）; 如果（viewFullScreen）{ viewFullScreen.addEventListener（“ click”，function（）{ var docElm = document.documentElement; 如果（docElm.requestFullscreen）{ docElm.requestFullscreen（）; } 否则，如果（docElm.mozRequestFullScreen）{ docElm.mozRequestFullScreen（）; } 否则，如果（docElm.webkitRequestFullScreen）{ docElm.webkitRequestFullScreen（）; } }，错误）； } }）（）;

<div class="container">      
            <section class="main-content">
                                    <center><a href="#"><button id="view-fullscreen">view full size page large</button></a><center>
                                           <script>(function () {
    var viewFullScreen = document.getElementById("view-fullscreen");
    if (viewFullScreen) {
        viewFullScreen.addEventListener("click", function () {
            var docElm = document.documentElement;
            if (docElm.requestFullscreen) {
                docElm.requestFullscreen();
            }
            else if (docElm.mozRequestFullScreen) {
                docElm.mozRequestFullScreen();
            }
            else if (docElm.webkitRequestFullScreen) {
                docElm.webkitRequestFullScreen();
            }
        }, false);
    }
    })();</script>
                                           </section>
</div>

在此处demo of click to open page in fullscreen

以查看演示演示文稿

Answer 5

您可以通过以下代码自动进入全屏显示：

mongoose.connect(mongodbURL,{useNewUrlParser:true}).then((conn)=>{
    console.log("Database Connection Successful");
}).catch(err=>{
    console.log(err);
});

let gfs;

connection.once('open',()=>{
    gfs = Grid(connection.db,mongoose.mongo);
    gfs.collection('uploads');
})

var storage = new GridFsStorage({
    url: mongodbURL,
    file: (req, file) => {
      return new Promise((resolve, reject) => {
        crypto.randomBytes(16, (err, buf) => {
          if (err) {
            return reject(err);
          }
          const filename = buf.toString('hex') + path.extname(file.originalname);
          const fileInfo = {
            filename: filename,
            root:'uploads'
          };
          resolve(fileInfo);
        });
      });
    }
});

const upload = multer({ storage });

router.post('/dashboard/uploads', upload.single('file') ,(req,res)=>{
    res.json({file:req.file});
})

演示：https://codepen.io/ConfidentCoding/pen/ewLyPX

注意：出于安全原因，并不总是有效。但至少对我有用。在检查和粘贴代码时不起作用。

Answer 6

<ion-item>
  <ion-label>Header</ion-label>
  <ion-select [(ngModel)]="items" multiple okText="OK" cancelText="Cancel">
    <ion-select-option value="all">Select all</ion-select-option>
    <ion-select-option *ngFor="let item of items" [value]="item.id">{{ item.name }}</ion-select-option>
  </ion-select>
</ion-item>

如何在全屏模式下自动打开网页

6 个答案: