How can i use two scroll in same page?


#1

Hi All,

I want to create two view in single page.
width - 50% and 50%.
Both view should scroll with different height.

Can any one help me??


#2

Hi @mhartington ,

How can i do that?? Please give me some suggestion ??


List and non-scrolling item
#3

Css is your friend here.


#4

Thanks For reply @mhartington

I want to implement above scenario with sidemenu default project. In that there is a player lists. I want to display two list in same pgae with scroll and one list have pullto refresh and infinity scroll.
Can we implement with sidemenu default project?


#5

I did that using two content in side playlists html page.

        <ion-content class="has-header left">
       <ion-list><ion-item>A</ion-item> </ion-list>
    </ion-content>
    <ion-content class="has-header right">
<ion-list><ion-item  ng-repeat="playlist in playlists" href="#/app/playlists/{{playlist.id}}">{{playlist.title}}</ion-item> </ion-list>
    </ion-content>

css- .left {
width: 10% !important;
left: 0 !important;
right: 90% !important;
}

.right{
    width: 90% !important;
    right: 0 !important;
    left: 10% !important;
}

In above code i am using two content. Is this a right structure ?


#6

This needs to be cleaned up, but it will get you in the right direction


#7

Thanks… @mhartington