无法更改两个css元素的值

时间:2015-12-14 13:28:30

标签: jquery css

我有这段代码

$(function(){
var padding1 = [1,15];
var fontSize = [18,23];


  var changeNavState = function(newStateIndex) {
    $("nav ul li a").data('state', newStateIndex).stop().animate({
        padding : padding1 [newStateIndex] + 'px'
    }, 300); 
    $("nav ul li a").data('state', newStateIndex).stop().animate({
        fontSize : fontSize [newStateIndex] + 'px'
    }, 300); 

  };

  var boolToStateIndex = function(bool) {
    return bool * 1;    
  };

  var maybeChangeNavState = function(condState) {
    var navState = $("nav ul li a").data('state');
    if (navState === condState) {
      changeNavState(boolToStateIndex(!navState));
    }

  };

  $('nav ul li a').data('state', 1);

  $(window).scroll(
      function(){
        if ($(document).scrollTop() > $('#home').offset().top - $('nav').height()) {
          maybeChangeNavState(1);
        } else {
          maybeChangeNavState(0); 
        }
     }
  );
}

);

因此,当用户滚动超过“家庭”的高度时那么导航栏填充应该是1和字体大小18,当它的次填充应该是15和fontSize 23.问题是它只适用于fontSize但是如果我擦除fontSize代码填充工作..有谁知道发生了什么?谢谢!

1 个答案:

答案 0 :(得分:1)

不确定这是否是原因......但我会将您的动画代码更改为:

$("nav ul li a").data('state', newStateIndex).stop().animate({
    padding : padding1 [newStateIndex] + 'px',
    fontSize : fontSize [newStateIndex] + 'px'
}, 300); 

将两者结合在一起。也许这两者是冲突的?