【问题标题】:Works for google chrome but not for firefox and IE适用于谷歌浏览器,但不适用于 Firefox 和 IE
【发布时间】:2013-05-29 01:37:08
【问题描述】:

有谁知道为什么这只适用于 chrome。它基本上是一个代码,当您向下滚动导航固定类时,将导航栏捕捉到顶部。并且函数 fix_top_bar 是一种使创建的条居中的方法。

function fix_top_bar(){
    var barWidth = $('.nav-fixed').width();
    $('.nav-fixed').css({ 'left' : '50%', 'margin-left' : '-' + (barWidth/2 + 20) + 'px' });
}

$('document').ready(function() {
        $(window).scroll(function() {
            if ($('body').scrollTop() > 112) {

                $('nav').addClass('nav-fixed');
                fix_top_bar();                              
                }else{
                $('.nav-fixed').css({ 'left' : '', 'margin-left' : ''});
                $('nav').removeClass('nav-fixed');
            }
        });

    fix_top_bar();
    $(window).resize(function(){
          fix_top_bar();  
    });
    });

【问题讨论】:

  • 为什么需要js来做这个?
  • FF 中到底发生了什么?
  • @gabe stackoverflow.com/questions/16789256/… 如果你真的想看看的话,那是我的另一个话题。
  • @AxelAmthor javascript 不起作用。并且启用了 javascript

标签: javascript jquery


【解决方案1】:

我认为你的问题是

$('document').ready(function() {

试试

$(document).ready(function() { // Note there is no tag <document>

【讨论】:

  • 没有修复它。有什么想法吗?
  • @madmanali93 你能在你的代码中显示 CSS 吗?在 jsfiddle.net 或 jsbin.com 上的问题的工作演示也会有所帮助。
  • @BenjaminGruenbaum 不知道
  • @rahulmaindargi stackoverflow.com/questions/16789256/… 一切都在这里,这是更新的小提琴jsfiddle.net/tQ46d/1
  • @rahulmaindargi 出于某种原因,我发给您的脚本不起作用。 jsfiddle.net/ngGzX/2 这是虽然
【解决方案2】:

if ($('html').scrollTop() &gt; 112) {

而不是 $('body').scrollTop() 在 Firefox 中为我工作。

编辑

但这在 Chrome 中不起作用...... doh。

另一个修改

丑陋,但这两者都适用:

var scrollTop = Math.max($('body').scrollTop(), $('html').scrollTop());
if (scrollTop > 112) {

必须有更好的跨浏览器解决方案...

【讨论】:

  • 好的,所以 html 适用于 firefox,body 适用于 html,但您提供的这两行似乎都不适用于两者。
  • 这是在 FF 和 Chrome 中似乎对我有用的小提琴 jsfiddle.net/qHN2x
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-09-02
  • 2012-09-19
  • 2018-04-28
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多