Elementor Creative Vertical Card Carousel/Slider (auto Sliding Effect) | Team Member Carousel Plugin

Hello how can i do this animation css whith elemntor container ?

please provide a new code. It's not working

What a lovely animation! 😍I bought the json file 🥂 But one question, when the slides are finished, it is showing an empty space for about 2 seconds before it starts the with the first slide again. Can we changed that, so it is a smooth loop without getting "empty"?

Hi, I followed your instructions, and have tried several times but it's not working. Is there a workaround? When I paste the custom copied HTML code, the elements don't disappear as they do in your video, it ends up just adding visible code into the page. Any help you can provide would be so gratefully accepted! Thank you for doing this!

Hi, great tut!

thanks! :)

damn I really needed this tutorial, thank you so much you saved my work here a lot, a question, where do I change it to instead of being from top to bottom to be from left to right? where do i move?

it looks impressive, I've tried using the containers instead selections and that messed it all up. any help?

Very nice! I just bought your template. I have 2 questions. is the number of slides limited to the ones made by you? is there a way to speed up the animation?
Cheers!

Hi There, Make Dream Website! Appreciate your kind help, I spent 5 hours and finally when I pasted the CSS Code, Elements Disappeared (Fine), but when I pasted html code, They never came back!! I am so concerned, all my effort will be wasted! please help. I am using Elementor 3.11 (Latest) and turned the Flex Container Off. I used inner section as you have advised. Many thanks.

Hey, really nice tutorial! Thank you! 🎉
I have a little question and hope you can help me. When I set up the slider as you describe it in your video, everything works fine in the Elementor editor. However, when I open the page in chrome, the carousel does not rotate, but the individual contents just replace each other without rotation. And I don't know where this issue comes from. Thank you 😊

c mon man.. r u serious??

Yisus man..😳😳😳 🤯

Ekhon ekta card ashole pore arekta teh scroll korle different lekha ashlo eita kivabe korbo?

Great video, Unfortunately it doesn't work for me. I followed every step, but I use only text without image and button. When I paste code into the column, one inner section has not disappeared, but others have disappeared. I pasted the HTML code then an internal section that did not disappear stuck at middle vertical and others did not appear and only the text moved.
But I'm not sure if other inner sections really disappeared or just all were in the same place in the middle vertical.

i used the flex box insted of row and cloumes, then i use the code and i dosent work. can you help me

bro I followed your each instructions, and have tried several times but it's not working with Container version. will u please make a new video on Container version

Hi. I sent you a request by filling out a form on your website, but I did not receive a response. The form is working, have you received the request?

I assume this one does not work with the container Elementor pro option? I mean the code snippet won't work?

Thanks for great tuto mate. IIf u distort the cards as they move, ie, side neareswt will be lareger than the bottom/far ( like paralellegram, .) oir flip them left right on focus )grow left side shrnk right, right grow, left shrink normal. add a horizontal gradient, that will givea a glow/shine to the eenlaerrged ssides as they come forward. It would be best to have animations run before text appears, (if its single word/title wontmatter much). but if you are gonna go route of svg animation,and u distorting text its going to a little more taxing than it should be in some instances. (death by gllyph memory tsunami)

Hi. Is the container version included when buying the template?

Nothing works for me, I spent all day and all night, redid it 2 times, checked the code, but it does NOT work.

Bro this is nicw but has issues with all the hompepage, after I finished witth the website,, The home page took alll the world to load, but when I deleted the the JVs you gave, everything went back to normal. even after I did full check optimisation. I really appreciate your effort, but what did you think is wrong with the code

Looks sooo much better than the stuttering slider of elementor. Any way to implement it with a sideways motion?

Is it possible that this tutorial works with vertical sliding videos instead of images?

Can i make this to scroll horizontally?

hai bro, Great tutorial !
I have 1 question 4 u, this is support for container bro ?

Hi I bought this slider from you but it keeps showing up as a hamburger menu. Maybe you could advise me

Do create a video or provide codes for container version. This is not working in container

Code I not working

But it didn’t work for me...i have elementor pro..but i download without paying money..i don’t know after having elementor pro why i couldn’t do that..please tell me brother😢

is this still working with the flex container ?

no longer working, needs update

Here we go solution for container issue;
----
Only one line is changed in JS code " var slide = $('.sliding .item'), "
Container = .sliding
İnner Containers ( slides ) added new class name = .item
-----
--CSS---
selector{
--change-duration: 0.75s;
height: 320px;
}
selector .item{
position: absolute;
left: 10px;
transform: translateY(-50%);
}
selector .item{
opacity: 0;
transform: translateY(-100%) scale(0.5);
}
.anim selector {
transition: all var(--change-duration) ease-in-out;
}
selector .after {
opacity: 0.4;
transform: translateY(100%) scale(0.8);
}
.anim selector .after {
animation: enter var(--change-duration) linear .1s ease-in-out;
}
selector .before {
opacity: 0.4;
transform: translateY(-100%) scale(0.8);
}
selector .current{
opacity: 1;
transform: none;
}
selector .before,
selector .after{
z-index: 1;
}
selector .current{
z-index: 2;
}

@keyframes enter {
0%{
opacity: 0;
transform: translateY(100%) scale(0.3);

}
25%{
opacity: 0.1;
transform: translateY(100%) scale(0.4);
}
50%{
opacity: 0.2;
transform: translateY(100%) scale(0.5);
}
75%{
opacity: 0.3;
transform: translateY(100%) scale(0.6);
}
100%{
opacity: 0.4;
transform: translateY(100%) scale(0.7);
}
}

Thank you so much for this! But with flexbox container active it doesn't work :') but well, i needed it soooooo bad that I made it work ahahah ... Basically I just wrapped everything like this:

--- Main Container
-- Base Container with class elementor-inner-section
- Last Container with class elementor-container and with image inside

And I used the same code u gave to us, anyway, thank youuuuu! This effect is awesome and is exactly what I wanted

yaar pura dikhao

i will try container but it not working...

Thank you for giving me amazing tutorial.. but brothe one issue this is not working in flexbox container why?
give me solution plz...

You are a genius! Thank you for your work, I hope everything is okay with you! You are expanding horizons, pushing the boundaries of what is possible on a low-budget platform

It's very nice, thank you, but I want to add an arrow to it, how can I do this?

Its not working on using flexbox container

Nice, Is there have any way to add user controlled arrow button?

I absolutely love this effect, thanks so much. Bought the json file an implementing it on a website I'm building. Is there any way you could update it to the flexbox / container? I'm having problems integrating it into the layout due to this being columns. Thanks and my best wishes!

javascript code is not working

please help

I bought this template and it's working in the editor but not when I visit my page as a visitor. How is that possible? I tried different computers and browsers..

Doesn't work at all!

is it scrollable or does it only have the auto scroll animation in it? Like can the user switch manually the cards?

how about container new version of elementor? whats css code? because this code doesn't work

Doesn't work anymore in 2024

not working

EVERY time I search something I need for my Elementor website, you have already created a tutorial for it!!! This channel is simply amazing. I am grateful you have decided to create content and share this with us. It's unbelievable that this is free to watch.