Text fade in on slideshow debut theme

Solved
noenshop
Excursionist
31 0 14

Hello,

 

can someone help me. I am using the debut theme. On desktop I am using  as lideshow and you can see the text and button fade in. But on mobile screen not. Can I fix this also on mobile screen? I want the text fade in also on mobile screen.

 

www.noenshop.nl

password: glowyi

 

Thank a lot!

0 Likes
dmwwebartisan
Shopify Partner
4529 1019 1317

@noenshop 

I checked both desktop and mobile. It looks the same, can you please provide a screenshot pointing out what you need?

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
noenshop
Excursionist
31 0 14

On desktop the text in the slideshow comes up like a special effect. It fades in. On mobile screen it is solid, it doesnt come up. Do you understand me? If not, I have to make a video about it.

dmwwebartisan
Shopify Partner
4529 1019 1317

@noenshop 

Please add the following code at the bottom of your assets/theme.css file.

 

@media only screen and (max-width: 749px){
.slideshow__slide--active .slideshow__text-content.slideshow__text-content--vertical-center, .no-js .slideshow__text-content.slideshow__text-content--vertical-center {
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.slideshow__slide--active .slideshow__text-content, .no-js .slideshow__text-content {
-ms-transform: translateY(-40px); 
-webkit-transform: translateY(-40px);
transform: translateY(-40px) !important;
opacity: 1;
}
.slideshow__slide--active { opacity: 1; z-index: 2; }
.slideshow__slide {transition: opacity 1000ms ease 0s;}
}

 

 

Let me know if this works.

Thanks!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
noenshop
Excursionist
31 0 14

Thanks for your help! I really appreciate that!

The picture is now fade in on mobile, very nice! Thank you. Can the text also comes up on mobile screen like desktop?

dmwwebartisan
Shopify Partner
4529 1019 1317

@noenshop 

sure, I will check and get back to you.

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
noenshop
Excursionist
31 0 14

Thankyou very much! You are great!

dmwwebartisan
Shopify Partner
4529 1019 1317

@noenshop 

I checked but it can't be done easily with inspecting elements. It will take time. If you can provide me your theme zip file. I will check further what is the problem.

Let me know.

 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
noenshop
Excursionist
31 0 14

Oke, how can I give you theme zip file. Where can I find it

dmwwebartisan
Shopify Partner
4529 1019 1317

@noenshop 

You can share Dropbox links or send zip direct via email. You can get my email in my signature. I will provide a solution here so others can take benefits.

Thank you!

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes