CODEWITHSUNDEEP
angularjscordovaionic-framework
Test user
Test user

Reputation: 459

How to display image as slide in ionic?

hi i have an array of images 

$scope.allimages = [{
        'src' : 'img/home1.png'
    }, {
        'src' : 'img/home2.png'
    }, {
        'src' : 'img/home3.png'
    },{
        'src' : 'img/home4.png'
    }];

i need to display this image in a page one by one i.e. one image at a time.one image display for 30 sec after the second image shows like that How can i do that

Upvotes: 0

Views: 8652

Answers (2)

psundar4u
psundar4u

Reputation: 11

You could use ion-slide-box, then you need to set slide-interval to 30000 to change image in 30 seconds, its default to 4 seconds. TRY THIS 

<ion-slide-box auto-play='true' does-continue='true' slide-intervel='30000'>
  <ion-slide ng-repeat="img in allImages">
    <img class="custom-class" ng-src="{{img.src}}"/>
  </ion-slide>
</ion-slide-box>

Upvotes: 1

Pankaj Parkar
Pankaj Parkar

Reputation: 136134

You could use ion-slide-box, then you need to set slide-interval to 30000 to change image in 30 seconds, its default to 4 seconds.

Markup

<ion-slide-box slide-interval="30000">
  <ion-slide ng-repeat="img in allimages">
    <img class="custom-class" ng-src="{{img}}"/>
  </ion-slide>
</ion-slide-box>

Upvotes: 1

Related Questions