Question

我使用以下代码来保存“火车时间表”的标签，类似于CSS“固定”属性，以允许我垂直滚动页面但保持标签“水平固定”。这个脚本运行正常，但我希望看到它更顺畅，我尝试使用.animate属性，但在这种情况下无法使它工作。

我可以让所有工作顺利进行，我只是希望它更顺畅。任何帮助表示赞赏。

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
  $(window).scroll(function(){
      $('#tramLabels').css({
          'left': $(this).scrollLeft() +5 
      });
  });
</script>

以下是该页面的其余代码;

<style type="text/css">
#tramLabels {
    position: absolute;
    z-index: 99;
    width: 200px;
    top: 0px;
    left: 5px;
}
#tramTime{
    position: absolute;
    z-index: 0;
    width: 100%;
    top: 0px;
    left: 10px;
}
</style>


</head>

<body>
<div id="tramLabels">
  <table width="100%" border="0" cellspacing="0" cellpadding="0">
  </table> 
</div>
<div id="tramTime">
  <table width="900px" border="0" cellspacing="0" cellpadding="0"> 
  </table>
</div

编辑：我放置了代码here for you to try

Answer 1

试试这个：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
  $(window).scroll(function(){
      $('#tramLabels').animate({
          'left': +5 
      });
  });
</script>

Answer 2

我用.animate（）和.stop（）尝试过这个。 http://jsfiddle.net/C2f7f/

JQuery：.animate on $（window）.scroll function

2 个答案: