Slide box in app works strange on ipad3 mini.
when i slide right with my finger out of the screen, the page can not slide completely. it just stop as in the picture.
This only occurs when sliding right, not left. If i click on the screen, it will slide to normal state.
Is there anything i can do to fix this?
Everything works well on chrome and ipad emulator.
// Ionic Starter App
// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
var app = angular.module('starter', ['ionic'])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
});
})
.controller('MediaCtrl', function($scope) {
$scope.allImages = [{
'src' : 'img/pic1.jpg'
}, {
'src' : 'img/pic2.jpg'
}, {
'src' : 'img/pic3.jpg'
}, {
'src' : 'img/pic4.jpg'
}, {
'src' : 'img/pic4.jpg'
}, {
'src' : 'img/pic5.jpg'
}, {
'src' : 'img/pic6.jpg'
}, {
'src' : 'img/pic7.jpg'
}, {
'src' : 'img/pic8.jpg'
}, {
'src' : 'img/pic9.jpg'
}, {
'src' : 'img/pic10.jpg'
}, {
'src' : 'img/pic11.jpg'
}];
});<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.min.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
</head>
<body ng-app="starter">
<ion-pane>
<ion-content ng-controller="MediaCtrl" >
<div>
<ion-slide-box show-pager="false">
<ion-slide ng-repeat="image in allImages">
<img ng-src="{{image.src}}" />
</ion-slide>
</ion-slide-box>
</div>
</ion-content>
</ion-pane>
</body>
</html>