javascript - Ionic Framework: how to disable bounce effect in slider box? - Stack Overflow

admin管理员组

文章数量:1431726

I'm currently working on an app that has fullscreen slides, the thing is that I want to be able to stop the bounce effect whenever I'm either on the first slide or the last slide.

That is, if I'm on the start slide, disable the bouncing effect when dragging from the left. Likewise, if I'm on the last slide, disable the bouncing effect when dragging from the right. Is there a way to implement this?

(I know that Ionic has attribute name hasBounce, but that only works for the ion-content directive, and it only works for the top and the bottom)

I'm currently working on an app that has fullscreen slides, the thing is that I want to be able to stop the bounce effect whenever I'm either on the first slide or the last slide.

That is, if I'm on the start slide, disable the bouncing effect when dragging from the left. Likewise, if I'm on the last slide, disable the bouncing effect when dragging from the right. Is there a way to implement this?

(I know that Ionic has attribute name hasBounce, but that only works for the ion-content directive, and it only works for the top and the bottom)

• javascript
• html
• ionic-framework

Share Improve this question Follow edited Apr 27, 2020 at 10:56 Tomislav Stankovic 3,1261717 gold badges3737 silver badges4343 bronze badges asked May 14, 2014 at 22:20 user3596620user3596620 3722 silver badges44 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

You could use has-bouncing on ion-content

<ion-content 
   has-bouncing="false"
   start-y="55"
   padding="true"
   has-tabs="true"
   has-header="true">

working in ionic 1.3.1 ;)

i searched in lib/ionic/jsionic.bundle.js

.directive('ionSlideBox', [
  '$animate',
  '$timeout',
  '$pile',
  '$ionicSlideBoxDelegate',
  '$ionicHistory',
  '$ionicScrollDelegate',
function($animate, $timeout, $pile, $ionicSlideBoxDelegate, $ionicHistory, $ionicScrollDelegate) {
  return {
    restrict: 'E',
    replace: true,
    transclude: true,
    scope: {
      autoPlay: '=',
      doesContinue: '@',
      slideInterval: '@',
      showPager: '@',
      pagerClick: '&',
      disableScroll: '@',
      onSlideChanged: '&',
      activeSlide: '=?',
      bounce: '@'
    },
....

, bounce: '@'

so bounce is working :)

<ion-slide-box bounce="false" ></ion-slide-box>

本文标签： javascriptIonic Framework how to disable bounce effect in slider boxStack Overflow