Is it possible to navigate directly to a card within the swiper? I tried looking around, but didn’t see any related questions/answers.
I have button cards for each room/room temp, and a swiper card below, which includes graphs of the room temperatures. I’d like to click the temperature button for a room and have the associated graph display in the swiper. I think this would be possible using lovelace-state-switch, but I’d have to give up the swiper function.
Conditional cards would be a better solution than state-switch as this is a core feature. I don’t think it is possible though what you ask. I was looking for this as well. But swiper gives me too much headaches, it doesn’t run smooth. It always hangs for 2 to 5 seconds when used in a popup card and I even tried to put the views in swiper. This looks amazing and the coverflow effect really is cool. But it is so laggy that I got frustrated using it at all.
It does work fine on standard views when I don’t use many cards. For graphs like your situation this card works perfectly fine.
I’d try a conditional card anyways, saves you installing state-switch (unless you are looking for user-specific cards you can do everything with conditional cards).
I hope one day this swipe card will be able to render entire lovelace views without lag (and without the accidental clicks on swipe) this card would be so awesome. (It still is but only for smaller projects).
This is awesome! Can this be added to HACS?
Is it possible to integrate a “title” to this awesome card?
I´m not a programmer but would be glad if anyone could tell me what I´ve to adjust to get a title
Bye
Nic
Hello,
I am trying use swiper card with slider cards. Is it possible to disable draggable and use only navigation?
Thank you for answer.
@Nesty, here is the code I use for my thermostat cards. I tap the arrows to change between the up and dowstairs tstats. Look at the parameters specifically.
- type: custom:swipe-card
parameters:
centerInsufficientSlides: true
navigation:
slidesPerView: 'auto'
spaceBetween: 0
nested: true
allowTouchMove: false
cards:
- entity: climate.downstairs
type: thermostat
style: |
ha-card {
margin: 0px 4px 4px 4px;
}
- entity: climate.upstairs
style: |
ha-card {
margin: 0px 4px 4px 4px;
}
type: thermostat
How it looks:
Thank you! allowTouchMove: false is the magic 
Has anyone tried using the direction: ‘vertical’ in order to vertically navigate through cards instead of horizontally? I haven’t figured out where to insert this parameter mentioned in the https://swiperjs.com/api/ page.
You could simply put in a markdown card at the top and have the card set up to be transparent.
Example below:
@Bram_Kragten I know it is still a beta, but I would like to mention that the swiper-card doesn’t work with HA 0.101.x as of yet. See screenshots below what I mean. I have tried to remove everything but the swiper-card and it seems the swiper-card is causing this problem (when commenting the swiper card it works perfectly fine). It also works fine with older versions (and the current stable version).
Like I said it is still in beta, though I still felt I should mention it as it might be something breaking.
This is what it should actually look like:
Is it possible to use a navigate type command to jump between slide cards.
I’d like a button without the panel that would jump to another panel within the slide?
Thanks
Hi @jimz011
I really like the way your dashboard looks.
Would it be possible to share your lovelace yaml please? 
Hi
Thanks alot for the great work with this card.
I made a autoplay swipe-card with 3 weather location cards that plays nice.
But if you go to another tab/screen and then come back again the autoplay is disabled (or not animating anymore). Going to the hamburgermenu (or manually draging the weather cards) and updating the lovelace configuration gets the autoplay going again
- type: custom:swipe-card
# start_card: 1
parameters:
effect: flip
slideShadows: true
autoplay:
delay: 7000
speed: 3000
# pagination:
# type: 'bullets'
scrollbar:
hide: true
draggable: true
snapOnRelease: true
cards:
- type: custom:weather-card
entity: weather.smhi_nobel
name: Malmö Nobel
- type: custom:weather-card
entity: weather.smhi_are
name: Åre
- type: custom:weather-card
entity: weather.smhi_salen
name: Sälen
(btw this is my second post ever and first time encluding code so I hope I got it right)
You can do this:
autoplay:
disableOnInteraction: false
This won’t fix the cards stopping the animation, however simply touching a single card (tap, swipe, slide whatever) will make the animation start again. This is how I use it in my own setup.
Jup, found that also, to bad it doesn’t come back on when going from tab to tab.
Both cards are installed. Mini Graph card works fine alone but not working here with the swipe card.
No card type configured.
- type: 'custom:swipe-card'
parameters:
spaceBetween: 8
scrollbar:
hide: false
draggable: true
snapOnRelease: true
cards:
- type: 'custom:mini-graph-card'
entity: sensor.basement_sensor_relative_humidity_measurement
name: Temperatuur
- type: 'custom:mini-graph-card'
entity: sensor.living_room_sensor_relative_humidity_measurement
name: Luchtvochtigheid
- type: 'custom:mini-graph-card'
entity: sensor.master_bedroom_sensor_relative_humidity_measurement
name: Licht
HI,
Using my first swiper setup, I can’t find the answer to a few questions, so turn to you:
I have a set of custom button cards with aspect ratio 1/1 and Id like the swiper to have a width of 1 button in a row of 4 buttons. However, Ive tried both 25% or eg 50px in the card-width field, but it still shows me a full width swiper.
Have now added it to a horizontal stack like this:
- type: horizontal-stack
cards:
- !include /config/lovelace/includes/include_button_swiper_home_glance.yaml
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
color_type: blank-card
- type: custom:button-card
color_type: blank-card
which works fine, but was wondering if this is the way to go.
Secondly, I’d like the swipe to simple continue to the first when it reaches the last button, while it now seems to quickly scroll back to the first button. Do I need a dedicated setting for that?
O, and lastly: is this card now deprecated? Seems the repo is locked, and no more development taking place? If so, is there a new alternative we should use?
thanks for having a look!
this is my current config:
parameters:
effect: coverflow #flip
slideShadows: true
autoplay:
delay: 3000
disableOnInteraction: false
# speed: 300
# pagination:
# type: 'bullets'
scrollbar:
hide: true
draggable: true
snapOnRelease: true
cards:
- !include /config/lovelace/includes/include_button_sensor_home.yaml
- !include /config/lovelace/includes/include_button_alarmclock.yaml
- !include /config/lovelace/includes/include_button_trash_today.yaml
- !include /config/lovelace/includes/include_button_espresso.yaml
- !include /config/lovelace/includes/include_button_vijverpomp.yaml
- !include /config/lovelace/includes/include_button_animated_weather.yaml
- !include /config/lovelace/includes/include_button_wind_direction.yaml
- !include /config/lovelace/includes/include_button_levering_verbruik.yaml
