android 瀏覽器 內容區 內嵌 scroll 不能滾動解決

來源:互聯網
上載者:User

android 瀏覽器 內容區 內嵌 scroll 不能滾動 這個問題困擾了我好一段時間。這個bug很久以前就有人提了。但是android2.x 估計沒戲解決了。4.x 這個問題不存在http://code.google.com/p/android/issues/detail?id=6864

今天花了4小時來研究。小有成果,在此記錄一下代碼:

t.php

================================================================

<html><head><script src="http://code.jquery.com/jquery-1.7.2.min.js"></script><style type="text/css">body {background:#fff}.m1 {width:100%;height:300px;background:#f00;overflow:auto;}.m2 {width:100%;background:#0f0;}</style><script>var atouch = {    "x":0,    "y":0,    "start":function(e){        e.preventDefault();        atouch.x = e.originalEvent.touches[0].clientX;        atouch.y = e.originalEvent.touches[0].clientY;    },    "move":function(e){        var x = e.originalEvent.touches[0].clientX;        var y = e.originalEvent.touches[0].clientY;        this.scrollLeft =  this.scrollLeft + atouch.x - x;        this.scrollTop  =  this.scrollTop  + atouch.y - y;        atouch.x = x;        atouch.y = y;    },    "init":function(id){        var ua = navigator.userAgent.toLowerCase();          var isa = ua.match(/android/i) == "android";        if(isa && $.browser.webkit && $.browser.safari && $.browser.version < 554 ){            $(id)            .bind('touchstart',  atouch.start)            .bind('touchmove',  atouch.move)        }    }};$(function(){    atouch.init("#m1");    msg = "";    for(s in $.browser){        msg += s + "=" + $.browser[s] + "<br>";    }    $("#msg").html(msg);});</script></head>    <body>        <div id="m1" class="m1">            <div class="m2" >            <?php for($i=0;$i<30;$i++){ ?>                <p><?php echo $i;?></p>            <?php }?>            </div>        </div>        <div id="msg">        </div>    </body></html>

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.