css - 为维基百科制作侧边栏

Question

我正在尝试设计维基百科的样式。我想将目录放在边栏中；但是，我遇到了一些障碍。我想:

• 如果目录短于 视口(viewport)高度。
• 在保留滚动功能的同时移除长目录的滚动条。
• 指定边栏 %width 和最小/最大宽度，并让正文内容填充其余部分。

请参阅this视觉效果。

这是我目前所拥有的:

@-moz-document domain(wikipedia.org) {

#mw-navigation, #toctitle, #footer {display:none;}

/* Place table of contents in a sidebar */
#toc {
    height: 100%;

    width: 20%;
    min-width: 150px;
    max-width: 250px;

    position: fixed; /* don't scroll with page. */
    top: 0;
    bottom: 0;
    left: 0;

    overflow: hidden; /* hide scrollbar, but... */
    }

    #toc > ul {
        background: lightblue;

        overflow: scroll; /* ...still allow scrolling? */

        /* center vertically if shorter than height of viewport */
        display: table-cell;
        vertical-align: middle;
    }

#content {
    /* How to have contents fill the remaining width? */
}
}

有没有人能解决这些问题？它们甚至可能吗？

Answer 1

我创建了一个用户脚本，它允许我定义自定义链接，这些链接既可以水平显示在维基百科的顶部，也可以显示在位于页面左侧的导航面板中。我把它复制到 Gist 以防有人感兴趣。它应该可以帮助您实现我认为的目标:

Wikipedia User Defined Navigation Links (Gist)

要使用此代码，您需要找到您的维基百科主题 JS 文件，该文件将成为您的用户页面的子页面。我的是 here .您可以通过单击此链接找到您的，该链接会自动将您定向到适当的位置。您应该先登录维基百科，然后 click here .