Mobil tarayıcıda çalışmak için div scroll overflow-x nasıl alabilirim?

Masaüstü tarayıcılarda çalışan bu kodum var. Bu davranışa mobil tarayıcılarda nasıl ulaşabilirim? Temel olarak kenarlara kayan bir menü oluşturmak istiyorum.Mobil tarayıcıda çalışmak için div scroll overflow-x nasıl alabilirim?

<style type="text/css"> 
    #navBar { 
     height: 55px; 
     width: 80px; 
     overflow-x: scroll; 
     overflow-y:hidden; 
     white-space: nowrap; 
    } 

    #navBar div { 
     display: inline-block; 
    } 
    </style> 


    <div id="navBar"> 
      akdhbaIDBhbfbhwhfbaibf 
      <div style="width: 100px; text-align: center; background-color: red;"> 
       <img src="" alt="Nav1" /> 
       <br /> 
       <span style="font-size: 80%">Nav1</span> 
      </div> 
      <div style=" width: 100px; text-align: center;"> 
       <img src="" alt="Nav2" /> 
       <br /> 
       <span style="font-size: 80%">Nav2</span> 
      </div> 
      <div style=" width: 100px; text-align: center; background-color: red;"> 
       <img src="" alt="Nav3" /> 
       <br /> 
       <span style="font-size: 80%">Nav3</span> 
      </div> 
    </div>

kaynak

2012-07-21 the_farmer

Hiç sadece sormak http://stackoverflow.com/questions/11590036/force-inner-elements-to-overflow-x –

evet, mohamad gelen cevabım var, ama çalışmak için bu kodu nedd cep tarayıcıları üzerinde. Bu kodu mobil cihazda nasıl çalıştıracağınızı biliyor musunuz? –

Kodunuzu tam olarak yükleyebilir misiniz? Mobil cihazlar için çalışıyorum, size daha fazla bilgi sağlayabiliyor ve size hangi cihazlarda görünüyorsanız yardımcı olabilirim. –

Sen -webkit-taşma kaydırma ile yerli kaydırmayı etkinleştirebilirsiniz: dokunma;

<html> 
    <head> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
    <style> 
    div { 
     overflow-y: hidden; 
     overflow-x: scroll; 
     -webkit-overflow-scrolling: touch; 
     width: 150px; 
     border: 1px solid grey; 
    } 

    h1 { 
     width: 400px; 
    } 
    </style> 
    </head> 
    <body> 
    <div> 
     <h1>some content here</h1> 
    </div> 
    </body> 
</html>

kaynak

2012-07-22 01:36:25 gronke

Cevabınız için teşekkürler, ben sadece html sayfasında bu kodu koymak ve benim ipod ve benim android htc ve kaydırma değil.Kesinlikle değil eksik mi? Teşekkürler. –

Bugün test edeceğim bir Android telefonum yok, ancak iOS aygıtlarımdaki en son bellenimle x yönünü kaydırıyorum. Hangi iOS/Android sürümlerini kullanıyorsunuz? – gronke

android: 2.33; ISO: 2.2.1 –

Mobil tarayıcıda çalışmak için div scroll overflow-x nasıl alabilirim?

cevap

İlgili konular