JS: 如何实现iframe内嵌窗口 自动全屏的效果,而非手动点击 ???
本帖最后由 y294945022 于 2024-11-7 10:47 编辑说明:
在根窗口 下,加入了 多个内嵌窗口,想要实现其中1个内嵌窗口 自动全屏的效果,而不是手动点击全屏按钮。
例子: https://www.dmttang.com/vodplay/6445-15-33.html
我在视频网站中,在写自动全屏播放插件时,遇到的问题:用 .requestFullscreen() 方法,没有效果, 但在 控制台测试 是有效果
所以想到另一个办法,就是 更改 iframe的大小,让其等于根窗口 或 无限接近于根窗口。
内嵌窗口宽高都是100%,我重新给其赋值为html的宽高,但依然没有效果,在网上查也没查到,所以来此请教。
//就下面两句代码,可以先在 控制台 测试。
document.querySelector("iframe").height=document.querySelector("html").clientHeight+'px';
document.querySelector("iframe").width=document.querySelector("html").clientWidth+'px';
即便是在iframe 加载完成后,再执行,依然没有效果:
document.querySelector("iframe").addEventListener('load', function() {
//两种都没有效果。
console.log(3);
document.querySelector("iframe").requestFullscreen()
console.log(4);
document.querySelector("iframe").height=document.querySelector("html").clientHeight+'px';
document.querySelector("iframe").width=document.querySelector("html").clientWidth+'px';
});
注:全屏 ,是指 铺满电脑屏幕的宽、高 。就是平时我们看 电影时的全屏播放。
全屏可以用 (https://developer.mozilla.org/zh-CN/docs/Web/API/Element/requestFullscreen)。
本帖最后由 y294945022 于 2024-11-6 21:45 编辑
全屏可以用 (https://developer.mozilla.org/zh-CN/docs/Web/API/Element/re ...
放在插件中,没有效果。
若是直接放在控制台,就有效果。
我加了一个iframe 的加载完成后,再执行此 方法,但还是没有效果。
document.querySelector("iframe").addEventListener('load', function() {
console.log(3);
document.querySelector("iframe").requestFullscreen()
}); 本帖最后由 FitContent 于 2024-11-6 22:44 编辑
y294945022 发表于 2024-11-6 21:38
放在插件中,没有效果。
若是直接放在控制台,就有效果。
楼主是想 iframe 加载完成之后让它自动全屏?很遗憾,这做不到。
这个 api 为了安全性,用户必须与页面或 UI 元素进行交互才能使用此功能。
本帖最后由 y294945022 于 2024-11-6 22:53 编辑
FitContent 发表于 2024-11-6 22:15
楼主是想 iframe 加载完成之后让它自动全屏?很遗憾,这做不到。
这个 api 为了安全性,用户 ...
那把iframe 的 大小,设置 成 根窗口 大小呢?或者 无限的接近根窗口的大小 。 这个如何设置呢? y294945022 发表于 2024-11-6 22:50
那把iframe 的 大小,设置 成 根窗口 大小呢?或者 无限的接近根窗口的大小 。 这个如何设置呢?
我看了一下楼主最开始贴的代码,给 iframe 的 `height、widht` 属性赋值时没有添加上单位 `px`!
FitContent 发表于 2024-11-6 23:19
我看了一下楼主最开始贴的代码,给 iframe 的 `height、widht` 属性赋值时没有添加上单位 `px`! ...
这个测试了一下,虽然设置成功。但还是 没效果。
即便 放在控制台都没有一点效果产生。 y294945022 发表于 2024-11-7 00:04
这个测试了一下,虽然设置成功。但还是 没效果。
这样交流下去不是办法,有用的信息太少,大都依赖于猜测了。楼主可以做一个简单的例子发在评论区,这个例子只需要能复现楼主遇到的问题就行。
贴上一个能运行的代码呀,你这样问除非非常熟悉的不然回答不了 本帖最后由 y294945022 于 2024-11-7 10:48 编辑
FitContent 发表于 2024-11-7 00:34
这样交流下去不是办法,有用的信息太少,大都依赖于猜测了。楼主可以做一个简单的例子发在评论区,这个 ...
你说的对,我重新编辑了帖子,加入了 例子。全部代码还是那两句。
例子: https://www.dmttang.com/vodplay/6445-15-33.html
//就下面两句代码,可以先在 控制台 测试。
document.querySelector("iframe").height=document.querySelector("html").clientHeight+'px';
document.querySelector("iframe").width=document.querySelector("html").clientWidth+'px';
页:
[1]
2