创建一个随着页面滚动而移动的浮动小部件答案

【问题标题】：Creating a Floating Widget that moves as the page scrolls创建一个随着页面滚动而移动的浮动小部件
【发布时间】：2012-11-21 18:22:35
【问题描述】：

所有，我正在使用 Wordpress 小部件，但我想创建一个小部件，它随着页面的滚动而向下浮动。有没有人做过这样的事情？如果是这样，您能否就如何实现这样的小部件提出任何建议？是否仅通过 Javascript/CSS 完成？

谢谢！

【问题讨论】：

【解决方案1】：

您需要做的就是通过 CSS 将相关元素的位置设置为fixed，即

.myFloatingWidget {position:fixed; left:0px; top:50%}

【讨论】：

【解决方案2】：

最简单的方法 - 安装这个新的 WordPress 插件 - Q2W3 Fixed Widget

它是专门为此目的而设计的！

【讨论】：

考虑从网站复制一些内容或解释，以防链接失效。
您需要披露您与此插件的从属关系。请参阅May I promote products or websites I am affiliated with here?

【解决方案3】：

您需要为小部件指定position:fixed; 的样式。 W3Schools 的示例。

【讨论】：

【解决方案4】：

slashnick 和 maxedison 的解决方案会起作用。

如果您希望动态滚动框不会一直停留在屏幕上，或者需要注意站点的页眉、页脚或任何其他 div，您可能需要查看 DropTheBit 的粘性浮动 jQuery 插件：@ 987654321@

【讨论】：