Here我在右侧边栏中有一个 div，它应该以这种方式运行:
1) 当您向下滚动页面并且 div 到达浏览器屏幕的顶部时，它的类发生变化，它将固定在屏幕顶部，直到您到达 div 的父元素的底部。
2) 一旦 div 的底部到达父元素的底部，它的类变回非固定位置。
这是供您使用的 jsfiddle http://jsfiddle.net/comparebest/z2Nyn/1/
现在的问题:
出于某种原因，在 FireFox 中，一旦 div 到达父元素的底部，div 就会消失，而在 Chrome、IE 和 Safari 中，它仍然可见。
您可能需要缩小浏览器屏幕的尺寸才能观察到此行为。
如何防止div在FF中消失？
附言:
这是 jQuery 代码:
function fixInParent(selector) {
var $el = $(selector);
$(window).scroll(function() {
if($el.parent().offset().top > $(this).scrollTop())
$el.addClass('top').removeClass('floating').removeClass('bottom');
else if ($(this).scrollTop() + $el.height() < $el.parent().offset().top + $el.parent().height())
$el.addClass('floating').removeClass('top').removeClass('bottom');
else
$el.addClass('bottom').removeClass('top').removeClass('floating');
});
}
$(document).ready(function() {
fixInParent('#floater');
});
最佳答案
您面临的问题实际上非常简单，但有点烦人。根据 CSS 2.1 的规范，它指出:
The effect of 'position:relative' on table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, and table-caption elements is undefined.
来自w3.org:“9.3.1 Choosing a positioning scheme: 'position' property”
因此，即使所有其他浏览器都将此值用作“预期”，Firefox 忽略它也没有错。因此，您应该考虑一个解决方案，其中带有 <td> 的父 style="position:relative;" 元素不是您的“ float ”框的引用。
也许这里的答案可以帮到你:
"Does Firefox support position: relative on table elements? "
关于jQuery 更改类 - div 在 Firefox 中消失，在 Chrome、IE、Safari 中正常，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12983609/