Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Disable horizontal bounce #35

Open
devnix opened this issue Jan 20, 2016 · 2 comments
Open

Disable horizontal bounce #35

devnix opened this issue Jan 20, 2016 · 2 comments

Comments

@devnix
Copy link

devnix commented Jan 20, 2016

Hi there, thank you for your plugin! I'm finding it very useful for now, apart from the fact that ionSlideBox it's deprecated now.

The ion-slide-box have a bouncing effect on Chrome for Windows like the rest of the components, but on Android every scrollable item stops bouncing excepting the slide. This wouldn't be a big problem, but on my boss' iPad the bounce on that component is behaving crazy...

I'm not getting results with the property hasBounce. My view structure right now is the following (a little weird, but I found it the only way to make my structure and scrolls as I wanted with few CSS tweaks)

<ion-view view-title="Carta">
    <tab-slide-box tab="0" class="carta">
      <div class="tsb-icons" style="margin-top: 44px;">
        <div class="tsb-ic-wrp">
          <ion-scroll direction="x" class="tsb-hscroll scroll-view ionic-scroll" >

              <div class="tabs">
                <a class="tab-item active">Favoritos</a>
                <a class="tab-item">Bocadillos</a>
                <a class="tab-item">Hamburguesas</a>
                <a class="tab-item">Bebidas</a>
                <a class="tab-item">Cervezas</a>
                <a class="tab-item">Cervezas</a>
                <a class="tab-item">Cervezas</a>
                <a class="tab-item">Cervezas</a>
                <a class="tab-item">Cervezas</a>
              </div>

          </ion-scroll>
        </div>
      </div>
      <ion-content style="margin-top: 68px;">
        <ion-slide-box show-pager="false" on-slide-changed="updateTab($index)">
          <ion-slide>
            <ion-list>
              <div class="row">
                  <ion-item ng-repeat="article in articles" href="#/playlists/{{playlist.id}}" class="categories-item col-25"  on-hold="holdItem()">
                    <!-- {{playlist.title}} -->
                    <div class="card card--expand categories-card">
                      <div class="item item-divider categories-image" style="height: 200px; color: white;" ng-style="{'background': 'url(/img/categories/{{article.image}})  center / cover'}">
                        <div class="categories-text-overlay">
                          <h2 text-scroll>{{ article.name }}</h2>
                          <p>{{ article.subtitle }}</p>
                        </div>
                      </div>
                    </div>
                  </ion-item>
              </div>
            </ion-list>
          </ion-slide>
          <ion-slide><h1>Bocadillos</h1></ion-slide>
          <ion-slide><h1>Hamburguesas</h1></ion-slide>
          <ion-slide><h1>Bebidas</h1></ion-slide>
          <ion-slide><h1>Cervezas</h1></ion-slide>
          <ion-slide><h1>Cervezas</h1></ion-slide>
          <ion-slide><h1>Cervezas</h1></ion-slide>
          <ion-slide><h1>Cervezas</h1></ion-slide>
          <ion-slide><h1>Cervezas</h1></ion-slide>
          <ion-slide><h1>Cervezas</h1></ion-slide>
        </ion-slide-box>
      </ion-content>


    </tab-slide-box>


</ion-view>
@anujsphinx
Copy link

I am also facing issue with horizontal bounce.May Anyone respond me to restrict that bouncing effect,

@PNSites
Copy link

PNSites commented Jan 11, 2017

I would be really happy if someone could help me out with the exact same problem that @devnix also faced.
Do anyone have a solution for restricting this bouncing effect?

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants