jQuery实现侧边栏随窗口滚动

近日帮人作主题要求弄个侧边栏某个模块随窗口一起滚动，可能其他童鞋也想给主题加上这个小功能，贴出来，供大家参考。
方法一：
很简单，前提是你的主题必须已加载了jQuery。
把下面代码加到主题头部header.php模版中即可：
<script type=”text/javascript”>
$(function() {
var $sidebar = $(“#sidebar”),
$window = $(window),
offset = $sidebar.offset(),
topPadding = 15;

$window.scroll(function() {
if ($window.scrollTop() > offset.top) {
$sidebar.stop().animate({
marginTop: $window.scrollTop() – offset.top + topPadding
});
} else {
$sidebar.stop().animate({
marginTop: 0
});
}
});

});
</script>
可根据不同的主题模版，自行修改一下其中的DIV标签#sidebar名称。此方法兼容所有浏览器。
演示效果
HotNews主题也可使用该功能，默认是整个侧边栏随窗口滚动，受主题布局功能限制，单独滚动某个模块效果不是很理想。
参考自：http://css-tricks.com/scrollfollow-sidebar/
方法二：
本人未试过，可以自行参阅：js页面滚动时层智能浮动定位实现
$.fn.smartFloat = function() {
var position = function(element) {
var top = element.position().top, pos = element.css(“position”);
$(window).scroll(function() {
var scrolls = $(this).scrollTop();
if (scrolls > top) {
if (window.XMLHttpRequest) {
element.css({
position: “fixed”,
top: 0
});
} else {
element.css({
top: scrolls
});
}
}else {
element.css({
position: “absolute”,
top: top
});
}
});
};
return $(this).each(function() {
position($(this));
});
};
$(“#float”).smartFloat();