Question

我想在我的网站上留下一个左栏。目前，它只延伸到可见窗口的底部。如果我在网页上向下滚动，则会显示左侧栏的下边缘。换句话说，它不会一直到页面底部。我需要这个左栏滚动网页，但也一直到底部。这是我的代码的简化版本：

div.sideBar {
    position: absolute;
    z-index: 1;
    height: 100%;
    max-width: 210px;
    width: 18%;
}

我还在网页的背景中修复了一个画布：

<canvas id="backgroundCanvas" style="display:block; position:fixed;
    width:100%; height:100%; top:0; left:0"></canvas>

在那之后，我的旁边吧：

<div class="sideBar">  Some links are here </div>

然后，我的网页的主要部分向下延伸到屏幕底部：

<div style="position:relative; z-index:1; width:1100px;
    max-width: calc(65% - 40px); height:100%; margin:0 auto;">

    500 lines of text that you need to scroll down to see.
    The left bar should extend all the way to the bottom of this.
</div>

我尝试过将left，right，top，bottom设置为0，但它似乎无法正常工作。我尝试了位置：固定，但这不是我想要的。左侧栏应该正常滚动页面的其余部分（就像它已连接一样），但也一直延伸到底部。

Answer 1

CSS代码是：

＆＃13;

div.sideBar {
    position: absolute;
    z-index: 1;
    height: 100%;
    max-width: 210px;
    width: 25%;
    overflow-y: scroll; /* or auto */
}

＆＃13;

<div class="sideBar">  Some links are here</div>

＆＃13;

Answer 2

try:

    ssh_command = pxssh.pxssh()
    hostname = remotename
    username = loginname
    password = loginpassword
    #ssh_command.PROMPT= '> | Do you want to enable it NOW? [Y/N]'           #self-defined original prompt 
    ssh_command.PROMPT= '> '           #self-defined original prompt 
    #ssh_command.login(hostname, username, password,original_prompt='[#$>]')
    ssh_command.login(hostname, username, password,auto_prompt_reset=False)
    ssh_command.prompt()
    print(ssh_command.before)
    ssh_command.sendline('shell')   # run a command
    #print(ssh_command.before)
    #ssh_command.PROMPT='Do you want to enable it NOW? [Y/N]'             # match the prompt
    print(f[0:-4])
    ssh_command.prompt()
    print(ssh_command.before)
    ssh_command.sendline('mkdir /var/nsinstall/%s && ls -l /var/nsinstall' % f[0:-4])
    ssh_command.prompt()
    ssh_command.sendline('tar xzvf /var/nsinstall/%s -C /var/nsinstall/%s' % (f, f[0:-4]))
    ssh_command.prompt()
    print(ssh_command.before)
    ssh_command.sendline('/var/nsinstall/%s/installns' % f[0:-4])
    ssh_command.PROMPT='Do you want to enable it NOW? [Y/N]'
    ssh_command.prompt()
    print(ssh_command.before)
    ssh_command.sendline('No')
    ssh_command.PROMPT('Reboot NOW? [Y/N]')
    ssh_command.prompt()
    ssh_command.sendline('Yes')
    #ssh_command.prompt()
    print(ssh_command.before)

Answer 3

我不情愿地使用JavaScript来解决问题。我使用以下代码将网页高度设置为网页加载后的最大网页高度：

var body = document.body;
var html = document.documentElement;
var leftBar = document.getElementById("sideBar");
function setLeftbarHeight() {
    var height = Math.max(body.scrollHeight, body.offsetHeight, 
               html.clientHeight, html.scrollHeight, html.offsetHeight);
    leftBar.style.height = height + "px";
}
//slight delay before setting the height of the left bar because
//  it may take a split second before the full length of the page is loaded
setTimeout(function(){
    setLeftbarHeight();
}, 200);
setTimeout(function(){
    setLeftbarHeight();
}, 600);

HTML将左栏延伸到滚动网页的底部

3 个答案: