Javascript 如何使我的页脚从顶部覆盖100%的高度和宽度？

我有一个带有页眉、页脚和内容的html页面。当用户单击我的页脚时，我希望页脚覆盖从顶部开始的整个页面。当我将页脚的高度和宽度设置为100vh和100vw时。它从底部开始。如何从顶部覆盖？

---

您需要使用

百分比%

而不是

vh/vw/px

。您需要设置

top:0和
高度：100%
（设备屏幕的全高）


函数切换（）{
var className=document.getElementById（'footer'）.className；
if（className=='footer'）{
document.getElementById（'footer'）。innerText='单击以最小化'；
document.getElementById（'footer'）。className='footer full'；
}否则{
document.getElementById（'footer'）。innerText='Click to miximize'；
document.getElementById（'footer'）。className='footer'；
}
}
.footer{
背景色：#000；
颜色：#FFF；
宽度：100%；
填充：20px0；
}
.满{
身高：100%；
宽度：100%；
位置：固定；
顶部：0px；
左：0px；
}
我的标题

您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。




您好，单击页脚将其展开。



单击以最大化
试试这个：

$('.footer').click(function(){
        $(this).toggleClass('new_footer');
    });



.new_footer{
    background-color: #000;
    position: fixed;
    top: 0;'
    left: 0;
    right: 0;
    bottom: 0;
    height: 100vh;
    width: 100%;
    color: #fff;
}


我的领班
内容
我的页脚
我尝试了这个方法，但它仍然只是从底部开始增加，顶部大小保持不变。您应该设置
位置：固定；顶部：0