Question

我的wordpress博客上有一个post-share小部件。

.post-share {
    width: 80px; padding: 10px 0px; padding-bottom: 0; background: #ffffff; border: 1px solid #CCC;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    text-align: center;
    position: absolute;
    top: 680px;
    left: auto;
    z-index: 99;
    margin-left: -120px;
}

检查此页面（http://www.linuxstall.com/linux-file-permissions-chmod/）。该职位为absolute。因此，当访问者向下滚动到页面时，它会消失。当我将位置改为'固定'时。用户必须在其浏览器上打开“全屏”才能看到完整的小部件（实际上小部件很长）。我希望它是绝对的，但我希望它随着访问者向下滚动页面而向下移动。我该怎么办？

Answer 1

“简单”的方式就是改变你的css。只需替换

position: absolute;
top: 680px;

与

positiion: fixed;
bottom: 10px;

将使您的小部件在屏幕底部完全可见（直到用户以640x480运行）并在用户向下滚动时保持位置。

如果您希望窗口小部件在打开网站时只是半可见但在用户开始滚动时在视口顶部保持可见，则需要一些javascript（在我看来，如果可能的话，应该避免使用）。

当访问者向下滚动到帖子时如何移动小部件？

1 个答案: