Question

最近刚刚从另一个用户的问题和答案中使用了一块JS，它在解决我遇到的最初问题方面非常好，即使在页面上也有页脚粘在视口高度的底部哪些内容不会填满整个页面，但现在似乎又引起了另一个问题。

在需要滚动查看所有内容的页面上，页面以视口高度结束，不允许滚动，这意味着无法查看部分内容。

我使用的代码如下，代码的功劳归属于claudix，并且来自他在此页面上的答案：

How to make the web page height to fit screen height

<!--Code Starts-->
<body style="overflow:hidden; margin:0"> 
  <form id="form1" runat="server">
        <div id="main" style="background-color:red">
            <div id="content">

            </div>
            <div id="footer">

            </div>
        </div>
    </form>
    <script language="javascript">
        function autoResizeDiv()
        {
            document.getElementById('main').style.height = window.innerHeight +'px';
        }
        window.onresize = autoResizeDiv;
        autoResizeDiv();
    </script>
</body>
<!--Code Ends-->

想知道是否有人知道我可以添加到那个javascript的内容，上面的代码可以用于没有完整内容的页面，但是，当需要滚动时，JS代码被禁用了吗？

谢谢！

Answer 1

在标题中使用此代码

<script type="text/javascript">


 jQuery(document).ready(function(){

var docheight = jQuery(document).height();
var bodyheight = jQuery('body').height();
var bodywidth = jQuery('body').width();


/*alert(docheight+'--'+bodyheight);*/

if (bodyheight < docheight && bodywidth >= 1000) {

    $(".footer-class-name").css('position',"absolute");

    }


});
</script>

Answer 2

尝试切换正文标记上的overflow:hidden;，因为这样可以防止内容被删除。

根据我的理解，您希望使用自己的自定义滚动技术创建一个单页网站。您可以尝试添加slimScroll for jquery为您的站点创建自定义滚动面板，同时保持透视图，而不使用浏览器的滚动。

Answer 3

只需阅读一篇博客文章即可。我已经删除了JS代码，这对任何可能需要它的人都有好处，但是，只是想说清楚我并没有对Claudix的JS代码说任何坏事。但是，我只使用了最小高度：100vh;在页面容器上，现在页脚始终是按钮，即使没有要清除的浮动元素，它也解决了这两个问题。谢谢！：）

页脚JS调整问题

3 个答案: