更新: 修好了! 我最终将包含表格的Div的宽度和高度增加了100%,这使“全屏”完美地贴在屏幕上,使我也可以看到以前无法看到的两个滚动条。 感谢那些试图帮助我的人!
我有一个div
,里面有table
,并且div
进入了全屏模式,table
很大,所以您看不到全部内容全屏显示,所以我需要滚动功能才能工作。
垂直滚动在全屏模式下有效,但水平滚动屏不起作用,有人知道如何使其在全屏模式下与水平滚动屏一起工作吗?
这是一个ASP.NET MVC
应用程序。
我用来使div
全屏显示的方法:
function fullscreenActivate() {
var i = document.getElementById("overviewDiv");
if (i.requestFullscreen) {
i.requestFullscreen();
} else if (i.webkitRequestFullscreen) {
i.webkitRequestFullscreen();
} else if (i.mozRequestFullScreen) {
i.mozRequestFullScreen();
} else if (i.msRequestFullscreen) {
i.msRequestFullscreen();
}
}
div
(表是动态加载的,table
中没什么特别的):
<div id="overviewDiv">
Loading...
</div>
我在CSS
上拥有的div
:
overflow-x: scroll;
overflow-y: scroll;
答案 0 :(得分:0)
我不确定我是否理解这个问题,但是: 1)您需要有2个div的一个父级,其屏幕尺寸为1个,而表的尺寸应大于当前div的尺寸 2)您不需要js将父div设置为全屏,您可以使用width:100vw和height:100vh 3)您可以将父div设置为溢出:滚动
在此示例中,我将父级的宽度/高度设置为px,以更好地理解结果,您应该将其替换为vh / vw。
.parent-div{
background-color:red;
/*
Use this:
width:100vw;
height:100vh
*/
width:500px;
height:400px;
overflow:scroll;
}
.child-div{
background:green;
height:300px;
width:3000px;
}