window.scrollBy 在 Chrome 上的問題

edited 十月 2013 in Javascript
不知道是不是 Chrome的Bug...我也百思不得其解
想請教各位有經驗的同學們...

若在frame內使用scrollBy相關函式或值接使用變更scrollTop都會造成瞬間失焦問題...

如附的程式碼,當選擇下拉式選單的時候,iframe內若執行window.scrollBy,在 Chrome 下拉式清單會立刻關闔起來。

其餘IE/Firefox/Safari等瀏覽器則正常...

不知道是否有其他可替代的方案?我想自動捲動某個frame卷軸,但又不想影響在看select 項目時,被定時器因為執行scrollBy而關閉

index.htm
<select>
<option>a
<option>b
<option>c
</select><br>
<iframe src=iframe.htm width=50 height=20></iframe>



iframe.htm
<body>
1<Br>
2<Br>
3<Br>
4<Br>
5<Br>
6<Br>
7<Br>
8<Br>
<script>
function step ()
{
        window.scrollBy(0, 15);
}
window.onload = function ()
{
        setInterval('step()', 1500);
}
</script>
</body>

原始討論: http://twpug.net/x/modules/newbb/viewtopic.php?topic_id=6029

評論

  • edited 六月 2011
    我...是有賤招啦=.=
    依賴css去處理
    不過這麼一來...捲軸已經毫無意義,也未必要用iframe處理了 ~"~
    index.htm
    <script>
    window.onload=function()
    { 
    	ifr.init();
    };
    var ifr={
      ifr:null,
      movePx:15,
      point:1,
      maxHeight:0,
      timers:null,
      init:function()
      {
         this.ifr=document.getElementById('ifr');
         this.maxHeight=this.ifr.contentWindow.document.getElementById('c').offsetHeight;
         this.step(); 
      },
      step:function()
      {
          var _this=this;
          _this.timers=setInterval(function()
          {
              var px=(_this.movePx*_this.point);
              if((px+_this.movePx)>_this.maxHeight)
              {
                  _this.stop();
                  return false;
              }
              _this.ifr.contentWindow.document.getElementById('c').style.top='-'+px+'px';
              _this.point++;
          },1500);
      },
      stop:function()
      {
          this.ifr.contentWindow.document.getElementById('c').style.bottom='0px';
          this.ifr.contentWindow.document.getElementById('c').style.removeProperty('top');
          clearInterval(this.timers);
      }
    };
    </script> 
    <select> 
    <option>a 
    <option>b 
    <option>c 
    </select><br> 
    <iframe src=iframe.htm width=50 height=20 id="ifr"></iframe>
    

    iframe.htm
    <body> 
    <div id="c" style="position: absolute;top:0px;">
    1<Br> 
    2<Br> 
    3<Br> 
    4<Br> 
    5<Br> 
    6<Br> 
    7<Br> 
    8<Br> 
    </div>
    </body>
    
  • edited 六月 2011
    非常感謝...
    SoltyRain提供的方式可以解決我的問題..
Sign In or Register to comment.