Question

我的导航嵌套在左侧屏幕的div中，当用户向下滚动页面并到达像素296时，左侧导航缓慢显示，其宽度向右侧增长。

我现在拥有的是半工作。当用户向下滚动页面时，会出现嵌套在div中的导航，但我希望它能够向右慢慢动画并且不会发生。不确定我做错了什么。我遇到问题的具体方法是：

$("#slidebottom").animate({ width: "100" }, 'slow');

但这是我的整个代码：

$(window).scroll(function(){

  var wintop = $(window).scrollTop(), docheight = $(document).height(), 
  winheight =    $(window).height();

  var bottomHeight = $("#slidebottom").height();
  var zeroheight = 0;

  if  (wintop > 296) {
    bottomHeight = $('#slidebottom').height(docheight);
    $("#slidebottom").animate({ width: "100" }, 'slow');

  }

  if( wintop < 296)
  {
    bottomHeight = $('#slidebottom').height(zeroheight);    
    //$("#slidebottom").animate({ width: "0" }, 'slow');
  }
});

Answer 1

jQuery docs显示整数，而不是字符串，作为宽度的参数：

$("#slidebottom").animate({ width: 100 }, 'slow');

编辑：所以我错了，那不是问题;它也处理字符串。

Answer 2

尝试以下可能吗？

$("#slidebottom").animate({ width: '100px' }, 'slow');

我觉得单位对此非常重要，因为100可能意味着什么。不是很具体。你可以把它定义为字符串就好了。事实上，在他们为.animate提供的示例中，它被定义为字符串。

如何使用jquery缓慢地为div的宽度设置动画

2 个答案: