List doesn't scroll horizntally


#1

I have a relatively simple requirement. I have a bunch of sections (comprising of image and text and probably some dropdown) which needs to be scrolled horizontally.
I tried multiple examples and comments from this list with NO luck.

Any suggestions would be appreciated

<ion-list >

            <ion-item  >
                <ion-scroll direction="y">
                    <div class="row">

                        <div class="col-20" ng-repeat="c in level1_cat_list">
                            <img src="branding/images/product/cat_men.png">
                        </div>
                    </div>

                </ion-scroll>
            </ion-item>

    </ion-list>

Horizontal scroll in chrome doesn't work
#2

I was able to get this horizontal scrolling to work : http://codepen.io/calendee/pen/zaHit/

Unfortunately, it rubber bands back to the left. Anyone have a fix for that portion.


#3

Any luck with this? I’m also hoping to support horizontal scrolling…


Horizontal scroll problem
#4

This can be fixed by applying 100% width on the scroll


#5

Thanks, that worked :smile:

Is there any established way to have a list of cards horizontally scrolling, and have them all be the same height (the height of the tallest ‘card’, ideally? I’ve experimented some with display: table-cell but couldn’t get it working - thought I’d check to see if there was an easier solution.


#6

Did you have any luck with the horizontal scroll? I have a div which ng-repeats through an array. Inside the div there is an image and some text.


#7

Hi

Like Below example i am also facing the problem if we have more horizontal scroll list item then vertical scroll is not working.

Is there any way to resolve this problem.

See the Pen Ionic - Scroll List Horizontally by Yasin Simsek (@5uper) on CodePen.

Thank you
Prameshwar


#8

for anyone landing on the thread; I took the pen @Calendee made and ran with it. The horizontal list items are selectable and update the chart within the pen. Let me know if you find it useful, thanks


#9

@jasonhodges That looks awesome! It’s funny that still works with Ionic 0.9.27!


#10

Thanks! I am working on a project right now that I may use that horizontal list for.