bootstrap - no scrollbars on IOS?

2019-07-25 10:42发布

I am using bootstrap version 2.x and when i use the app on a non mobile browser the scrollbars work correctly, however when i browse using iOS (iphone 5) there are no scrollbars -- specially vertical scrollbars and i cannot touch scroll on the screen - its just fixed i cannot more left or right or up or down......

Is there something i need to enable for touch scrolling like a different js library? or is there something broken.

I have read that if the tags for are not closed properly this could occur but my tags are closed.

So basically all my content is now not visible except for the first portion as i cannot scroll down...

Here is some code ( i am using durandal as a SPA)

this is my shell:

<div>
    <header>
        <!--ko compose: {view: 'nav'} --><!--/ko-->
    </header>
    <section id="content"  class="main container-fluid">
        <!--ko compose: {model: router.activeItem, 
            afterCompose: router.afterCompose, 
            transition: 'entrance'} -->
        <!--/ko-->
    </section>
    <footer>
        <!--ko compose: {view: 'footer'} --><!--/ko-->
    </footer>
</div>

at the moment i removed all 'nav' and 'footer' rendering and only something in the content HTML that is rendered in there a simple page:

<section>
 <div>
        <button id="btnrefresh" class="btn btn-info btn-force-refresh pull-right"><i class="icon-refresh"></i> Refresh</button>
         <button id="btnrefresh2" data-bind="click: refresh" class="btn btn-info btn-force-refresh pull-right"><i class="icon-refresh"></i> Data Refresh</button>
        <h3 class="page-title" data-bind="text: title" ></h3>
     <div data-bind="visible: showDetails" style="height:500px;width:50px;background-color:red">

    </div>
     </div>
</section>

this will not scroll in IOS :(

1条回答
ら.Afraid
2楼-- · 2019-07-25 11:11

The answer to this was that it as a Durandal based problem.

After severe debugging and stripping everything out except durandal i figured out this can be fixed by opening up durandal/app.js and commenting out the following lines of code:

adaptToDevice: function() {
    //document.ontouchmove = function (event) {
    //    event.preventDefault();
    //};
}

Cheers

查看更多
登录 后发表回答