-
Posts
-
Hello,
I made a website, which has a lot color sections and in between text, so it looks like the text part moves over the picture. But the following problem arises on mobile, it looks strange and all elements made with the color section are not functioning. On mobile you see two the same pictures. First one above the text and the second underneath the text, which looks very strange. Is there a solution to make this work on mobile?I tried:
@media only screen and (max-width: 479px) {
.hr-inner { width: 50px !important; }
}
.avia-section { background-size: cover !important; }
.avia-section { background-size: 100% 100% !important; }But that doesn’t work.
Hey Eline!
Can you take a screenshot and highlight what your trying to do so we can get a better idea? I viewed your site and resized my browser but could not find the issue.
Cheers!
ElliottHi Elliot,
When you resize the browser to the smallest size, than you don’t see the problem. But if you open the website on a iphone (6), there you can see what the problem is.
It looks if the parts are not scrolling any more, it has just became one big image the whole website, without sliding layers. Also the color sections are not in the right size. It looks if they stay to big.It took some screenshots from my iphone, but I am not sure if you can see it here, cause these are static images. So you do not see the missing effect.
Hopefully you are able to see it on a phone, because than you can see that everything is scrolling instead of only a few parts.
website adress is now: http://www.svdw.nl/
Hi!
I checked your website on my iphone 5s but could not see any issue.
Or are you asking about scrolled background images instead of fixed like on desktop? If not, please try to elaborate a little more :)Regards,
YigitHi Yigit,
Yes i think that where it is all about. Maybe it is really easy to fix, but I really can’t find it.
The problem is, that the desktop version looks good, there it looks like if there are two layers on top of each other, but on the mobile version it looks completely different! Images are not fixed like on the desktop, the whole website became one big image, with double images, which looks really not nice.
Also the banners with the bleu lined houses, which I made in a color section, are not ‘shrinking’ enough to see them on a screen that small. I hope you understand what I mean and hopefully there is a solution for it.
Best wishes, ElineHi Yigit,
Can you tell me if there is a solution for this? Or how I have to change the color sections in to something else so it works like the desktop version?
Hello,
I am sorry that I am asking again, but I really would like to solve it.
Could you please let me know if it is easy to solve, or what a solution could be? Or if these elements have to be build in a different way to keep the same effect on mobile, thats also good to know, but my client really wants to have a good mobile version. I hope you can help me out.Best wishes, Eline
Hey!
As I understand when user scroll the page you like the content to move over the background images in mobile just like the parallax effect how it happens in the desktop version correct? Unfortunately at this time this effect had to be disabled due to a bug in the mobile browser rendering engine. Please check this thread for more info https://kriesi.at/support/topic/parallax-effect-doesnt-work-on-ipad/#post-230599
If you are able to see the effect on our demos http://kriesi.at/themes/enfold-overview/ we can surely help you achieve the same on your site.
Regards,
VinayHi Vinay,
Thanks for your answer and good to know that it is not possible (yet). I have solved it now by showing some parts only at the desktop version an made a lot of new images which are only showing on mobile. The only thing now is that the menu on mobile is not function good. All the sub links are working, but the main menu items don’t work. Do you know how to solve this? I could’t find any earlier topic about this.
Best wishes, ElineHi!
Please check the Appearance > menu and make sure all main menus have link it should work fine. if the above solution don’t work please open a new ticket for new issues so we can relate to the original topic and not get mixed up with many issues here. We might need to login as admin and check your site so please share the login details in private content.
Cheers!
VinayHi Vinay and all the other guys,
You can close this ticket, the things are all solved. Thank you so much for all your help!
Best wishes, Eline
- The topic ‘Mobile website color sections not functioning and not responsive’ is closed to new replies.