Forum Replies Created
-
Posts
-
Hello Andy,
I’m sorry for the belated reply.
parallax scrolling on mobile is deactivated by default
That is some useful information! So the bug is caused by the parallax effect on desktop, which can’t be reproduced on mobile.
How can I allow parallax scrolling on desktop but disabled it on mobile? I know it is disabled by default, but right now it is still causing problems for my mobile.If the first one is working for you, then with media queries it should work fine, too.
Unfortunately, it does not. I provided the LogIns for you Mods. Feel free to quickly test yourself. It does not work.
I feel it would be best for you to work together with a freelance developer on those issues, especially if you want to customize things
I don’t want any customisation necessarily. I just want the mobile page to either not display as a very long list because of only one icon is being shown at a time, or hide columns on mobile which are unnecessary because the content (parallel effect picture) isn’t being shown anyway.
I should be able to set these within Enfold, but it does not work.BG,
SonicTonicHi Andy,
thank you again for looking into this.
if you want to increase the picture of your mobile phone on mobile devices use this code
Why would I want to increase the size? The picture of the phone is only visible in one of the three sections, where it is implemented in columns with the avia layout builder and in that section it is shown only half way. I can’t reproduce your screenshot on any of my devices, in private or new cache browsers. The picture is missing on “About” and “Background” and is stuck in between the sections “Tonics” and “Ingredients”. Please refer to the screenshots I have posted :)
For your “autosuggestion” icon: Use a Custom CSS Class for it, for example “test-icon”. Then use a code like this inside of Quick CSS field:
I’ve tried this solution and noticed that non of the @media is working. Since we’ve disabled the mobile responsiveness, as it was showing all our icons in a list which were just too long, the @media section is somehow not picking up. I’ve tried different resolutions. The margin worked without the @media perfectly though, that resulted in a bad view on the normal desktop page however.
EDIT: The margin did not work on the mobile device without the @media as well. I could not change the margin no matter what. I’ve tried different resolutions, leaving out the @media and trying really high margins. In the mobile version the “autosuggestion” label has never moved. It did on the desktop version though.
BG
Hey Andy,
I understand that it might seem this way, since you can’t reproduce the issue.
However, I have just now tested again with iPad mini, Iphone 7, Iphone 6 and Iphone 5 and all the screens show the same issue as I have documented with my screenshots. Caches have been cleared as well private mode engaged.
What phone (resolution) do you use that gives you such a view?
Also, even though the phone shows on your screen – and I believe that it is hard to understand my problem here (although I’m trying ;) – my main problem (getting the three sections to look the same as in same width or same phone in the middle) still remains. Therefore, I don’t understand your response “I can’t see anything wrong” and “it seems to me that it is already working as you need it”. Nothing has happened and nothing has been changed :(
Do you need more details on my problem? The screenshots documented my current situation and I’m trying to explain what is not working.
E.g. why is the phone showing on the blue Ingredients section but not on the others? The implementation is the same on all sections. Also the autosuggestion label is clearly overlapping. The div boxes should not make this possible. Why are the column not disappearing as coded?
The mobile responsiveness is clearly messed up and needs fixing. I’m going to provide all the informations you require, but the page is not looking great at all.
Hey Andy,
as you can see in my screenshots above, this is our current view, which is looking great from the icons (as it is more a cluster than a list) but is still broken because of the sections which do not want to disappear.
I attached some more screenshots for you guys :)
The Issue is the phone, which functions as background picture for the lefts columns. In 1 and 2 it is gone, yet the column remain. In section3 it is shown stuck in between.
Solution a) the phone picture should be shown next to the section. b) the phone picture disappears and the sections width extends to a 100%.The “About” Section should be full width, since the left section is .hidden.
The “Background” Section should be full width. Same issue.
Here the phone is not even fully hidden. It seems to be stuck in between the sections.
Hey Ismael,
thank you for your solution.
Unfortunately, it did not make the empty columns disappear :(I tried the Quick CSS field in the General Styling Section, as well as using Custom CSS Classes for the columns. It does not work.
@media only screen and (max-width: 1024px) {
.phone_pic #top .av-hide-on-mobile, .phone_pic #top .av-hide-on-tablet {
display: none !important;
}
}I assume the @media is not picking up (since the responsive site is disabled again), but it does also not work hard coded without the @media trigger. The custom css fields or not responding, the “hide on mobile” does not respond, the @ media trigger for .responsive is also not working.
I need to find a solution here guys :-/
I don’t necessarily have to switch of the responsiveness in the general styling, however, a listing of icons that takes up to 4 screen length is not acceptable for our users. Is there a way to make this responsive without having the effect of the first screenshot? We want it to be visible as the last screenshots, which display the icons more in groups as opposed to a list, but still make it look decent and not out of place with a phone picture hanging in the middle of a section (why??!) and some columns just don’t display the phone picture on the section – leaving a blank section.
Please help ;-)
Hallo Ismael,
danke für deine Lösung der mobile responsiveness. Diese Option hatten wir ausgeschaltet, weil die Auflistung der einzelnen Icons viel zu groß ist und diese daher untereinander dargestellt werden.
Um diese Option nutzen zu können müssten wir die Icon Container mit Bild und Schrift kleiner darstellen, damit man nicht 4 Mal scrollen muss, um durch eine Section zu gelangen ;)
Anbei die Lösung welche wir uns überlegt hatten. Diese stellt die Icons im Header Image und auch in den Sections besser dar.
Diese hat leider das Problem, dass die Sections nicht auf “hidden in mobile” oder Media 720px und co. Aufrufe reagieren, da die Seite einfach nur geschrumpft ist.
Vielen Dank.
Hey Rikard,
I updated the enfold theme but the mobile responsiveness is still missing.
I chose to not display the phone in the mobile sized screen, however, it still shows a half stuck picture of the phone on one section of the landing page, while leaving the textboxes aligned to the right side instead of stretching them to full width.Any help is appreciated, since this does not seem to be mobile responsive at all :(
Bg,
NikoEDIT: Thanks. I found it on the landings page, right sidebar.
Hey Rikard,
thank you for your reply. I’m not sure what you are referring to.
In the Appearance there is a: Header -> Header Layout/Transparency Section.
These are the section that doesn’t have any effect on the menubar.
Sticky Menu is disabled and there is no transparency logo (but a color).It still only appears after scrolling down for a bit. ;)
BG,
Niko
