Hide element in Mobile not working

Ask the community
,
1

I created a page to test this. There is nothing on the page but a single textbox called txtTest. I want the textbox to be hidden in Mobile. The Hidden on Load and Collapsed on Load properties are not checked. Here’s the only code on the page, taken from a WIX tutorial page (Velo Tutorial: Displaying Elements in Mobile Only | Help Center | Wix.com):

import wixWindow from ‘wix-window’;

$w.onReady( function () {
if (wixWindow.formFactor === “Mobile”) {
$w(“#txtTest”).hide();
}
} );

It doesn’t work. The element still appears in both Desktop and Mobile, even after published and viewed on an actual mobile phone.

If I change ‘Mobile’ to ‘Desktop’, it hides it in both. It doesn’t seem to recognize ‘Mobile’. It seems to think mobile is also desktop.

Any help would be appreciated.

Thank you!

2

Try this
$w(“#txtTest”).text = wixWindow.formFactor;
Run it in your phone and see what the value gets on the text, is it Desktop there is something wrong.

3

Very clever. Thank you!

So, it seems to be working OK on a real phone, but it says Desktop when I’m editing the mobile site. Is that normal? Makes it hard to edit

4

Got the same problem. Seems like editing and previewing the mobile site on a computer doesn’t work. You really have to check it on a phone.

5

Hi, Bruno. Yes, that’s too bad, because it means you have to publish the site to test it as you’re developing it. I hope Wix addresses this.

6

Hi,
This is an issue on our end, hopefully it will be fixed soon.

7

Hey
If you have a mac that you use to work on install xcode and then execute the iOS Simulator and use that for checking the site but it needs to be published to do 100% secure checks. Have you tried the device simulator in Chrome Dev Tools?

8

(I assume “Or” is Wix?..)

Thanks Andreas. Not sure how to use that yet, but looking into it. Thanks for the tip! (I have a Windows machine)