1

この Web サイトで左のナビゲーションを複製しようとしています: http://www.kahuna-webstudio.fr/。約 200 ピクセル下にスクロールすると、左側のナビゲーションが表示されます。私はほとんど 1 つの問題でそれを持っています: 現在、div の高さと幅を同時にアニメーション化しています。私がやりたいことは、左側のナビゲーション div の高さをドキュメントの高さに設定することです。次に、正確に 296 ピクセル下にスクロールすると、幅が 150 ピクセルになります。それが理にかなっていることを願っています。

私の質問は、この div の高さをドキュメントの高さに設定するにはどうすればよいかということです。次に、2 番目のステップは幅をアニメーション化することです。

  This is the line I am currently using:
  $("#slidebottom").stop().animate({height:docheight +"px", width:newwidthgrow + "px"},'fast');

  What I want to work, but is not working is:
  slidebottomHeight = docheight;
  $("#slidebottom").stop().animate({width:newwidthgrow + "px"},'slow');

これが私の現在のコードです：

  $(window).scroll(function(){
  var wintop = $(window).scrollTop();
  var docheight = $(document).height();
  var winheight = $(window).height();

  var newwidthgrow = 150;
  var smallheight = 0;
  var smallwidth = 0;
  var slidebottomHeight = $("slidebottom").height();


  if((wintop > 296)) {

    $("#slidebottom").stop().animate({height:docheight +"px", width:newwidthgrow + "px"},'fast');

  }

  if((wintop < 296))
  { 
   $("#slidebottom").stop().animate({height:smallheight +"px", width:smallwidth + "px"}, 'fast');
  }

});
4

2 に答える 2

1 
$("#slidebottom").stop().animate({
    height:docheight +"px"
},'fast',function(){
    // This is a callback function. It will be called when the animation
    // has finished executing.

    $("#slidebottom").stop().animate({
        width:newwidthgrow + "px"
    });
});
于 2013-08-14T21:13:58.403 に答える