Android上的异常滚动行为,用于长文本列表

时间:2014-12-01 10:05:08

标签: javascript html5 cordova ionic

我正在使用Ionic框架构建Cordova项目。该应用程序主要用于查看内容。我只是加载并将html文本附加到页面,用户滚动浏览它。我面临着非常奇怪的行为;当有大量文本并且用户试图滚动时,除非滚动背景,否则滚动不起作用。如果他碰巧首先点击文本,滚动将无法正常工作。它必须位于内容的白色“隐形”部分。

我花了2天时间尝试调试此问题。它适用于桌面浏览器(调试时)但不在设备上,我使用的是Galaxy s4 mini进行测试。这可能是我的设备特有的问题吗?同样,只有在页面上有大量文本时才会发生这种情况。

EDIT 这是包含ion-content

的部件的代码
<ion-side-menu-content drag-content="false" ng-init="searchOb={enabled:false}">
            <ion-header-bar class="bar-dark" ng-controller="ReaderCtrl" ng-init="init()"
                            ng-show="!searchOb.enabled">
                <div class="buttons">
                    <button class="button ion-arrow-left-a" ng-if="config.mode!='bundle'"
                            ng-click="backClicked()"></button>
                    <div class="coverImgContainer thumbnail floatLeft"
                         style="width:30px; height:37px; margin-right:5px">
                        <img class="portrait" ng-src="{{data.epub.book|coverPath}}"/>
                    </div>
                </div>
                <button class="button icon-right ion-android-dropdown button-clear" ng-click="chapterClicked()">
                    {{data.book.chapter.title}}
                </button>
                <h1 class="title"></h1>

                <div class="buttons">
                    <a ui class="button icon button-icon ion-search" ng-click="searchOb.enabled=true"></a>
                    <a ui class="button icon button-icon ion-android-drawer" ng-click="menuClicked()"></a>
                </div>
            </ion-header-bar>
            <searchHeader searchid="searchOb" onsearch="searchContent(key)"></searchHeader>

            <pageOptions ng-controller="PageOptionsCtrl" ng-init="init()"></pageOptions>
            <ion-content ng-controller="ContentCtrl" class="contentContainer ebook-content has-header has-footer"
                         ng-init="init()"
                         on-release="mouseUp()" ng-mousemove="mouseMove()" on-scroll="scroll()"
                         on-swipe-right="onSwipeRight()" on-swipe-left="onSwipeLeft()" scroll="true"
                         delegate-handle="content" padding="true" autoscroll="false"
                         has-bouncing="true" id="epubContainer">

                <div ng-bind-html="data.book.chapter.content"></div>

                <ion-refresher ng-if="chapterIndex>0" pulling-text="Previous Chapter.."
                               on-refresh="refresher()"></ion-refresher>
            </ion-content>
            <nextChapterScroll></nextChapterScroll>

        </ion-side-menu-content>

0 个答案:

没有答案