CODEWITHSUNDEEP
angularjscordovaangularjs-directiveangular-uiangular-ui-bootstrap
Gillardo
Gillardo

Reputation: 9818

MobileAngularUI scrollable directive for Windows Phone 8 (WP8)

I am using the mobile angular UI framework to develop our new app. it works great in android and ios, but having a couple problems with WP8.

The worst problem i have is that the scrollable class/directive doesnt seem to work, so i cannot seem to scroll.

Here is some code that is on a child view

<div class="scrollable">
    <div class="scrollable-content">
        some content here...
    </div>
</div>

My index.html page looks like this

<body>

<div class="sidebar sidebar-left" toggleable parent-active-class="sidebar-left-in" id="mainSidebar">
        <h1 class="app-name">m2i Anywhere</h1>

    <div class="scrollable">
        <div class="scrollable-content">
            <div class="list-group" toggle="off" bubble target="mainSidebar">
                options here...
            </div>
        </div>
    </div>
</div>

<div class="app">

    <!-- Top Navbar -->
    <div class="navbar navbar-app navbar-absolute-top">

        <div class="navbar-brand navbar-brand-center" yield-to="title">
            <span>m2i Anywhere</span>
        </div>

        <div class="btn-group pull-left" yield-to="navbarLeft"></div>

        <div class="btn-group pull-right" yield-to="navbarRight"></div>
    </div>

    <!-- content -->
    <div class="app-body">
        <div ui-view class="app-content"></div>
    </div>
</div>

</body>

Upvotes: 2

Views: 969

Answers (2)

Ankit Balyan
Ankit Balyan

Reputation: 1329

One can also do the trick by adding .scrollable { position: relative;}

Upvotes: 0

user3024734
user3024734

Reputation: 11

I was troubled by this problem for a few days, but I finally found a solution shown as following:

body, html { 
  -ms-overflow-style: none !important; 
}

Here is an example from the original solution proposal: https://gist.github.com/tjanczuk/7419485. The live demo is hosted here: http://htmlpreview.github.io/?https://gist.github.com/tjanczuk/7419485/raw/9a13fc9ad43f2103d8b9e23e25c7b0672a13385f/gistfile1.html. You can visit this live demo by using your Windows Phone to check the scroll performance. Good luck with it!

Upvotes: 1

Related Questions