wordpress一段短代码实现页面模块浮动

分享一段可以使页面模块浮动的代码。之前一直认为本博客的边栏是非常不理想的。文章长了或者评论多了导致single页面的右边栏缺角了似的。

最近找了下可以实现边栏随窗口下调浮动的代码。找过几个，都不是很理想，下面是我认为比较理想也确实简单可以实现这一功能的代码。这里分享给有需要的人。

<script type="text/javascript">
    var documentHeight = 0;
    var topPadding = 15;
    $(function () {
        var offset = $("#sidebar").offset();
        documentHeight = $(document).height();
        $(window).scroll(function () {
            var sideBarHeight = $("#sidebar").height();
            if ($(window).scrollTop() > offset.top) {
                var newPosition = ($(window).scrollTop() - offset.top) + topPadding;
                var maxPosition = documentHeight - (sideBarHeight - 0);
                if (newPosition > maxPosition) { newPosition = maxPosition; }
                $("#sidebar").stop().animate({ marginTop: newPosition });
            } else { 
                $("#sidebar").stop().animate({ marginTop: 0 }); 
            };
        });
    });
</script>

代码我就不会解析了。看得懂的都不需要，看不懂的直接复制粘贴使用即可。 (sideBarHeight -0);这里的参数0（零）不是O可自己调制。

效果就是本博现在的右边栏。#sidebar（该模块可修改你想要实现浮动的模块）上面代码放到</body>之前即可。。。其他不解释....

发布者