Smartphone view problem switch tab 
Autor: Papadopoulos T.
Visited 1187,
Followers 1,
Udostępniony 0
I have the following problem on my website.From mobile view the customer can not see the specifications of the product, because as soon as he clicks on the menu for more information then he starts not responding properly.The solution is not to use tabs but this is not very convenient.
Please find a solution to my problem.
Go to my website with your mobile phone and try to change the tab to see its specifications. (Touch over "Χαρακτηριστικά" and then you see what I mean)
Try here:
You do an amazing job with the program and all the new features are fantastic.
I look forward to your next ideas on the e-commerce part
Posted on the
Papadopoulos
Unless you have added special code I suspect it has to do with the new product sheet page. In a standard text box the height of the text box is always the same as the maximum depth required by any tab. On your example the 1st tab is only 144px deep on a mobile, on the second tab it explodes to 1337px deep (this is going to blow the existing CLS google issue right out of the park).
I do not have any answers I am sorry, but on the face of it this appears to be a bug so I have marked your post for Incomedia's attention.
Autor
Thank you very much for your explanation and for your attention too. This products was only for example, I have the same issue for all of my products.
(It > En) ... the problem is a false problem that has been known for several years ...
.. to solve it immediately and without EXTRA codes, it is enough to provide a small lateral margin as sufficient to allow the scroll of the page ...
... or, and only if you are interested in solving immediately with an EXTRA code of mine, leaving things as they are now, let me know, otherwise you already know what and how to do as mentioned before...
.
ciao
.
Autor
I have tried with other parameters but the problem persists and exists.In PC view everything works perfectly.I only encounter this problem in mobile viewing.If anyone has something to suggest, feel free to suggest it here.This will help other users too. Thanks
.... I checked; ... the situation has remained the same as before, you have not added margins as I said before to be able to evaluate; ... what was said before remains firm ...
... if you want to leave things as they are now, and if you want to try to do more with my EXTRA, exclusive and very simple invention, then paste this code of mine in the Expert | Custom code | 3rd option | Before closing the / HEAD tag:
... with adequate margins you do not need EXTRA codes; ... if you wait, the STAFF will tell you too ...
...
<style> @media (max-width: 719px) { .text-container:after{content:"";position:absolute;width:100%;height:100%;z-index:200000}} </style>
... ... a single copy / paste; ... simple, free, and within everyone's reach ......
... ciao ...
.
Autor
Good morning, thank you first of all. But still is not responding. I make the change to see it but is not good.
Autor
Autor
These parameters made things worse. Thanks for the tip but it does not work properly.
I better wait for incomedia because I think the problem is elsewhere and I do not have time to look for it. I tried some commands in an offline environment but it didn't work.
Autor
I change it again because was worse than before. If you see with a smartphone at the right side if you put your finger then you see it's ok but if you are in the center then is not responding properly.
... otherwise:
1) ... the code has not been applied; ... can not be evaluated ...! ...
2) ... the code does not create problems, is harmless, and many have used it correctly;
3) ... the code acts below the 720px breakpoint;
4) ... this STAMP is a real simulation colored in transparent:
.
ciao
.
Autor
I make the upload with the changes and try. The problem is still there. I make the change for every products and the new I make it only normal without this switch tab. Because that is a problem and take time to find.
If you have time look at this and tell me know.
Thank you very much for your time. I respect that.
... I have now been able to check on my smartphone, you have applied the code correctly, but you are right, the switching of tab to drag is inhibited, but the scroll does not work ...
... now I am not able to evaluate the alternatives, and in case I will let you know ...
ciao
.
Autor
Thank you very much for your time. I look it right now where is the problem exactly because it 's bad for customers not to be able to see it on their mobile phone and so i lose.
... OK ... I understand the problem where it is ...
...
... now with this small change my exclusive code will work correctly on your page too ...
... in your Pro.2021.2.5 version the touch priority on the switches has been changed, therefore my previous invention could not work ...
...
... you just have to try, now you are an expert ...
<style> @media (max-width: 719px) { .text-tabs:after {content:""; position:absolute; top:40px;width:100%; height:98%; z-index:200000 }} </style>
...
...
.
Autor
Thank you very much for everthing. You must work with incomedia baceuse you give always one solution to us.
I really appreciate your help.
... I checked on my smartphone ... OK ... it works correctly; ... is a confirmation...
...
...
.
ciao
.
Autor
KolAsim
You are a part of the team here?
(It > En) ... no! ... I'm a user like you
; ... and unfortunately I am currently without a PC and without a program;
... I relied on what I saw directly on your page ...
Hello, ciao
.
Autor
What kind of programming languages do you know?
If I need someone to create a website for my prospects, can you handle that pressure? Of course the construction cost will be determined by you. I hope I can find you when I need help.
... I only participate in the Forum; ... when you have a problem, just ask here; ... among us there are several willing and prepared users, willing to help, as well as of course the STAFF experts on program issues...
ciao
.
Autor
Thank you very much again for your willingness. I have tried other things of yours from solutions. Thanks a lot again !!!
Autor
Hello again, I have another problem with this code. If I change the value z-index to "6" then I can't use the link from the resize element and come the same issue.
Autor
example: https://www.ellin-store.com/product/?asrock-b450m-steel-legend-motherboard
... before the link was not there; the limit of my code is that there must be no links ...
... anyway, since the LINK is at the end of the text, try changing height:98% to > height: 85%;
... so that link could work...
.
ciao
.
Autor
Without links it's working perfect but is good for more details for my customers. I try! Thank you
Autor
Unfortunately it does not work on all products. So I will leave it as it is for now and I hope Incomedia finds a solution to this problem. Otherwise I will be more detailed in my descriptions.
... the code is for that page you linked, and it can't fail ...
... as an idea, you can put a note, for example (*), (**), (***), and the related links under the TAB, as you do for notes ...
.
ciao
.