致力于打造中国站长娱乐学习的免费资源站!

您当前的位置:首页 > 教程 > 网页设计 > JavaScript/JQuery

招租联系QQ:283852481

兼容IE6的固定浮动的两种方法

时间:2016-11-20  来源:互联网  

第一种:使用margin-top

$(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});}});});

第二种:使用position:absolute

$(function() {var $sidebar = $("#sidebar"),$window = $(window),offset = $sidebar.offset(),topPadding = 15;$window.scroll(function() {if ($window.scrollTop() > offset.top) {$sidebar.stop().css({"position":"absolute","top":$window.scrollTop()+toPadding});} else {$sidebar.css({"position":"static"});}});});

第二种方式还需要父类是相对于body,或者他的父类元素都没有position:relative;这个样式,否则的上面的变现就会出错。

当然实际操作还要更加复杂,使用时还要定义left/height/width等


精彩广告