Questions tagged [ion-slides]

Ion-slides is a component of the ionic framework, much like a simple slideshow.

Ion-slides is a component of the ionic framework, much like a simple slideshow, where you can next/prev by swiping.

108 questions
2
votes
0 answers

ion-slide not working with ngFor directive

[EDIT, new info on the bottom of the post] In my app I have a couple of different pages with a ion-slides element in. They all work correctly except one, and I've managed to follow the trail to the *ngFor directive. This is the html code of the…
2
votes
1 answer

ionSlides is undefined

I have a basic slider in my Ionic 4 project but this.slides is undefined at every point. A few days ago this worked, I just can't figure out why it doesn't work now. TS-File: import { IonSlides } from '@ionic/angular'; export class xyPage…
Bolin
  • 119
  • 10
2
votes
1 answer

How to combine ion-slides with ion-cards in Ionic4?

Combining ion-slides with ion-cards completely messes up the ion-cards. Somehow the cards are not vertically aligned, once I wrap them in the ion-slide, but side by side. I am creating an input form with different input questions in each card. Each…
2
votes
1 answer

Ionic 4 Slides - Set An Initial Slide

Is it possible to select a slide to display with a focus on as the initial one? I have an array of items to display in Ionic slides, and I want to "preselect" (= put focus on the slide) based on preferences but keep the order. I have read the Ionic…
Kit Ostrihon
  • 824
  • 2
  • 14
  • 36
2
votes
2 answers

ion-slides with smooth scrolling and no snapping

I'd like to use the component to create a album thumbnail scroller like on the Spotify mobile app. I have mostly got it working but I want to be able to disable the snapping. Is this possible?
juliusbangert
  • 627
  • 1
  • 6
  • 17
2
votes
1 answer

How to disable vertical scrolling while swiping ion-slide

I'm building an app where I have images inside a ion-slides with indvidual ion-slide tags, when I'm swiping horizontally the scroll bar sometimes activates which moves the page and causes the user to have to re-adjust. How can I lock the native…
li x
  • 3,953
  • 2
  • 31
  • 51
2
votes
0 answers

.ion-slide width less than device width causing space after last slide

I am using ionic latest version. Using ion-slide, I have limited the width of every single slide to 80% which is working fine. But if we scroll it to the end, there is white space area left and all the slides hide to the left. Snapshot :…
2
votes
1 answer

Applying slides in Ionic

I'm currently doing a Coursera study and stucked in a specific task. I'm trying to put some slides in my project. My project is a menu from a restaurant and I want to change between the dishes by sliding. My problems is that i dont know where to…
Max
  • 221
  • 5
  • 20
2
votes
1 answer

ion-slides click not proper working when slides last index move to first index

it's work perfect when slides first index to last but when auto loop go to last index to first index click property is not working.
user4574256
2
votes
0 answers

Navigating to page containing ion-slides causing the swipe behaviour to stop working

I created two pages with identical sliders. (say HomePage and Page1Page) I place Navigation links to the other in each (via navCtrl.push) Now while the slider works well (that is responds to both swipe and clicks on pager) on the HomePage, it does…
Mayank R Jain
  • 3,127
  • 1
  • 29
  • 43
2
votes
0 answers

Ionic multiple ion-slides with different effects on same page issue

I have a first ion-slides with effect cube. Then when I try to add a second ion-slides, the screen is blank. Any help will be much appreciated. My code is per below.
Ouba
  • 21
  • 2
2
votes
2 answers

ion-slides looping trick - not updating

I am trying to pull off a "trick" in ionic2 as follows: - I have one slide set to loop. - When the slide is swiped I increase or decrease a variable - that variable will cause different data to display in the slide. This way I can get the full UI…
Gotts
  • 2,274
  • 3
  • 23
  • 32
1
vote
1 answer

Ionic 6 Angular, Ion-Slide.slideNext() not function in custom button event

I have a home component, with slider-item component which has my ion-slides. In home I have an ion-header which contains Previous and Next Buttons. home.page.ts: import { Component, ViewChild } from '@angular/core'; import { DataService, Item } from…
Blackard
  • 85
  • 10
1
vote
0 answers

Click event don't fire on first slide ion-slide

Created a slider with ion-slides. But sometimes first and the last slide of slider don't fire the click event. Like we are displaying five slides: 2,3,4 slides fire event with no error and in 1,4 it doesn't fire click event neither shows any…
1
vote
0 answers

Ionic Slides not working with await/async

I'm using Ionic's slides component (based on Swiper) and it works great. However, I have a specific use case where I need to set the slider's spaceBetween option based on an async call. I tried using the .update() method but without any…
shAkur
  • 944
  • 2
  • 21
  • 45