首页 文章

HTML网页全屏第2部分

提问于
浏览 次
1

所以我现在让网页全屏显示，但我使用100％的高度来获取所有css属性，现在我在右侧获得了一个滚动条 .

http://www6.luc.edu/test/cabplan/maps/index2.html

当我将#content_container更改为高度89％时，它会更改它，但在其他屏幕尺寸上看起来会有所不同 . 如何制作它以使 Map 始终高度直到页脚上方右下方带有“esri”标志的页脚

html css fullscreen

1 回答

  • 0

    这将是更适合jquery的东西 . 您可以调用它来调整加载高度和窗口大小调整大小 .

    要获得您将使用的窗口高度

    windowHeight = $(window).height();

    你拿这个并将它分配给一个变量并减去页眉和页脚的高度 . 并通过使用设置CSS

    ${'#content_container').css({width: windowHeight+"px"});

    然后，如果有人调整窗口大小，则在以下函数中运行相同的选项

    $(window).resize(function() {
  //update stuff
});

    编辑

    $(document).ready(function(){
 windowHeight = $(window).height();
 divHeight = windowHeight - 100 - 100; // heights of your header/footer
 $('#content_container').css({height: divHeight+'px'});
});

$(window).resize(function() {
 windowHeight = $(window).height();
 divHeight = windowHeight - 100 - 100; // heights of your header/footer
 $('#content_container').css({height: divHeight+'px'});
});

    您可以通过分配变量替换100的静态高度调用并调用$（'#divid'） . height（）;由于您的 Headers 是position：absolute，如果您减去 Headers ，那么您需要将div从顶部定位到相同的px .

    在上面的javascript之前调用js包括以下内容 .

    <script src="http://code.jquery.com/jquery-1.6.4.min.js" />
    回复于

相关问题