The Buttons On The Mobile Version Don't Work. - Question | JoomShaper

The Buttons On The Mobile Version Don't Work.

edumarinho

edumarinho

Template 1 week ago

Hi I'm working with the Fusion template (https://demo3.joomshaper.com/2023/fusion/index.php), and the button links aren't working in the mobile view. Can you please help me with a solution? Thanks The site is: https://dev.zettacompulab.com/

0
10 Answers
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 1 week ago #223837

Hello,

Thanks for reaching out to us.

We checked the page, but we are unable to locate the button in the mobile view on our end.

Could you please share a screenshot showing the button that is not working on mobile? This will help us identify the exact section and investigate the issue more accurately.

Once we have the screenshot, we’ll be able to assist you further.

Thank you.

0
edumarinho
edumarinho
Accepted Answer
1 week ago #223874

Hello, thank you for your response.

I'm sending you the links to the images so you can see the buttons that aren't working. They work on the web version but not on the mobile version. I'd like a solution so that if we need to add any new buttons, this doesn't happen again. Thank you for your help.

0
edumarinho
edumarinho
Accepted Answer
6 days ago #223901

Hi I sent the requested information 12 hours ago and have not yet received a response. Thank you for your help.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 6 days ago #223914

The mobile button issue has been fixed.

Please edit your “Inicio” page using the Backend or Frontend editor. From there, you can add or remove anything as needed.

Thanks!

0
edumarinho
edumarinho
Accepted Answer
6 days ago #223947

Hello

Thank you for your help. May I ask how to fix the problem? Please let me know so I can keep this in mind.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 5 days ago #224000

I add a small css here: /templates/fusion/css/custom.css

Here is the css:

@media (max-width: 768px) {
    .section-circle-effect-right::after {
       pointer-events: none;
    }
}

Thanks

0
edumarinho
edumarinho
Accepted Answer
5 days ago #223979

Hi again Ziaul

Thank you for your support. The buttons do work in the mobile version. However, I'm now having a problem with the Offcanvas Menu. The links aren't working on Apple iOS devices. I've tried everything, but nothing works. It works on Android, but not on iOS. You can try it on an iPhone and you'll see it's a real problem. I hope you can help me resolve this issue.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 5 days ago #223998

Hi again,

I checked the issue on iPhone/iOS Safari and the menu is actually working, but Safari is taking too much time to properly render the Offcanvas Menu. This is a common issue with iOS Safari and Helix Ultimate offcanvas animations.

The main cause is usually the combination of:

  • transform: translateX()
  • transition: all
  • nested flex containers
  • dropdown submenus
  • Font Awesome icons
  • fixed/offcanvas containers

Android browsers handle this much better, but Safari on iOS often delays repainting and recalculating the layout before the menu becomes responsive.

I believe the biggest issue is the use of:

transition: all;

inside the offcanvas styles. On iOS this forces Safari to animate every property and causes rendering lag.

Please try adding the following CSS to:

Fusion - Default → Custom CSS or /templates/fusion/css/custom.css

.offcanvas-menu {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transition: transform .3s ease !important;
}
.offcanvas-menu * {
    -webkit-backface-visibility: hidden;
}
.offcanvas-menu .menu-separator,
.offcanvas-menu .menu-toggler,
.offcanvas-menu a {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

This improves GPU acceleration and reduces Safari repaint/reflow issues significantly.

I tested through Safari Web Inspector on macOS connected to a real iPhone, and the delay appears to be rendering/performance related rather than a broken link issue.

Please test the CSS above and let me know the result.

0
edumarinho
edumarinho
Accepted Answer
1 day ago #224243

Hi again

I pasted the suggested CSS code, but it's not working. The offcanvas menu doesn't work in either Safari or Chrome for iPhone. Is there any other solution for this template? I look forward to your reply.

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 8 hours ago #224299

Please allow us some time to investigate this issue.

Thank you for your patience.

0