VERTICAL IMAGE CAROUSEL - GSAP Elementor

[@nicopalmkvist]

All My Elementor Projects in 60 Seconds: kzbin.info/www/bejne/rYTZZXZpp6qjY8k Live demo: michellewp.com/streama/

[@videowebsite2018]

You fixed the glitch! Thank you!

[@stefanoaiellocopy]

​@@videowebsite2018 how can we fix that glitch too?

[@arbbell]

you are extremely professional. very good production value for such a small channel, i hope you grow big! you helped me and many others a lot

[@nicopalmkvist]

Thank you so much for this comment, it means a lot. More valuable video content is on the way.🔜

[@eekeek433]

This is a awesome feature to have on any website, thankyou for sharing :)

[@nicopalmkvist]

We thought so too :) It’s an absolute pleasure!

[@Taatan12]

es justamente lo que necesitaba

[@stefanoaiellocopy]

I think you miss the CSS about the heading, where is it? Thank you, i'm following your tutorial step by step and it's very easy

[@friendly421]

as the video is of quality, we can see the following code : selector .elementor-heading-title{ background-image: linear-gradient(180deg, #FFFFFF, #7D7D7D); background-clip: text; -webkit-background-clip:text; }

[@umzbiolinemanufacturersdnbhd]

it not working in mobile version

[@yingred03]

same with me. works well in the web but mobile was not

[@FactScriber]

how do i stop the carousel from overlapping my main menu

[@tammymorales596]

Thank you for this video! It's the perfect solution for what I've been trying to do. For the custom CSS for the heading... I don't see it in the link that you pasted. I only see your responsive code in addition to the 3 carousel CSS codes. Can you provide the heading CSS code please?

[@bobbyryandra]

Hi guys, thanks alot for the video. From Bobby in Bekasi - Indonesia

[@emvee2916]

Unfortunately, I already tried the same effect byt pictures are jumping with your code and live site at the end of the animation. That is because there should be a duplicate of each pic to ensure smooth transition and translateY should be -100% minus gap. Andrea Egli made a nice tutorial on that :)

[@brunoaguilar689]

Very nice content guys. Congrats

[@kapmagic]

Unfortunaly my first coluns overlaps my header, when i put 90 padding on Main Container, the STEP 1 Columns dont obbey and keeps overlaping my Header. May is escaping me something? Great Work

[@campusconnecttv170]

You’re so amazing ❤❤❤

[@campusconnecttv170]

please is there a tutorial on how the horizontal slider was created

[@YouMake_ma]

Hello ive followed this tutorial step by step but in the live page its still bugging for me, its not as smooth as your live demo. any possible reason? note that i have all plugin up to date.

[@nicopalmkvist]

Is it because your slider occasionally makes a little "jump"? If so, we've updated the code at this link: lifeonablock.com/streama-update/ Alternatively, you can download our template and import it. It's the one from our live demo.

[@francoisalbert5605]

@@nicopalmkvistThank you! The new CSS code works fine! ...there is still a problem about the columns, since the animation goes over the main menu. I set 90px of top margin for the main container, but the columns go beyond the margin...

[@iSeee_Uuu]

@@francoisalbert5605 I have the same problem , WHAT to do ?

[@manasamajam9198]

​@@francoisalbert5605Did you find any solution.if any please help me. Thanks 😊

[@andrijaya6194]

@@nicopalmkvist i send an email is this work for another object? not an image and more than 3, i want to set 4 container

[@martdelijster7014]

its not working on mobile what can i do to that?

[@aymonshik]

very nice work, but when I used the updated code, the carousel is floating up the screen, please help

[@efintina]

Hi. I purchased your template, but, on mobile, it jumps. I tried to add more then 4 images, but after looping first 4 it jumps to start one.

[@josipgrgic9683]

can you link image to a gallery or to a post? each image to its custom gallery or post

[@thewebstylist]

So awesome!

[@whitekriminal545]

Nice! 🔝

[@nicopalmkvist]

Thanks!

[@RaviTejaChillara]

can we loop it without the jerks in between?

[@nicopalmkvist]

Since we released the video, we have found a solution to this problem. We have updated it on our demo: michellewp.com/streama/ We will release a video about it later this summer, but for now, the only option is to buy our template on Gumroad and import the updated version. The link is here:michellewp.gumroad.com/l/umfbej

[@lucas101ish]

Does this work with videos too rather than just images?

[@nicopalmkvist]

That could actually be pretty cool to try. But I don't no if it works. In theory it does, you should just change the background of the column to and video.

[@fhdsadfjiosdafsdfesafars8704]

is there a way to make it so the image in the carousel loops back instead of teleporting back to its original spot

[@fhdsadfjiosdafsdfesafars8704]

just checked other comments and found the patch code but now the carousel is floating up the screen

[@aymonshik]

@@fhdsadfjiosdafsdfesafars8704 Same here, @nicopalmkvist please help

[@Edwardrangels]

Hello! I try to buy this effect through the link you provided, but there is nothing

[@nicopalmkvist]

Hi @Edwardrangels - here is the link: michellewp.gumroad.com/l/umfbej

[@Henrikjaa]

I followed the instructions, but the photos does not loop..

[@raccoon6160]

same

[@ericuk9481]

Hello, How does it look like on mobile?

[@rgspacelictics]

How fo I make a sign up page with data stored for users as email sign in in WordPress with custom slider as it

[@Brenuco]

Hey guys, it's not working on mobile for me. Any idea why?

[@Aziz-Ahmed-UK]

Challenge, how can we make it 3d diagonal? intead of vertical

[@IamDoQtorNo]

Where do we go to download those examples?

[@nicopalmkvist]

You can download them here: lifeonablock.com/strema-css/

[@AhsanHameed-fu7bv]

Can anyone help me with the issue. It's working fine. Whenever it's start next loop it's shows ak fliker

[@manasamajam9198]

Did you get any solution

[@leizerfroilich]

I put the updated code but it's export above

[@dercrazed]

thnaks!

[@RTX4060Playground]

Is this the code for title and text ? is it correct ? selector -elementor-heading -title{ background-image: linear-gradient(180deg , #FFFFFF, #707070); background-clip: text;-webkit-background-clip text; }

[@nicopalmkvist]

No this code uses selector -elementor-heading -title, which is not correct syntax and not work. There is an unnecessary "-" in the class name that needs to be removed. So: selector .elementor-heading-title { background-image: linear-gradient(180deg, #FFFFFF, #7D7D7D); background-clip: text; -webkit-background-clip: text; } Or: selector .elementor-heading-title{ background-image: linear-gradient(180deg , #FFFFFF, #7D7D7D); background-clip: text; -webkit-background-clip: text; }

[@RTX4060Playground]

@@nicopalmkvist Thank you. it works now

[@twinkleaggarwal]

After following all the instructions, it’s still not working on phone. Hope you revert.