2

次のコードを使用して、CSS の「fixed」プロパティに似た「train time table」のラベルを保持し、ページを垂直方向にスクロールしながらラベルを水平方向に「固定」したままにします。このスクリプトは正常に動作しますが、もっとスムーズに動作するようにしたいと思います。.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

編集：試してみるためにここにコードを配置しました

4

2 に答える 2

0

.animate（）と.stop（）でこれを試しました。http://jsfiddle.net/C2f7f/

于 2012-05-08T15:59:41.870 に答える
0

これを試して：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
  $(window).scroll(function(){
      $('#tramLabels').animate({
          'left': +5 
      });
  });
</script>
于 2012-05-08T15:51:50.470 に答える