Hello!
I hide a repeater on desktop and show it on mobile site. On mobile site looks fine. I have problem on desktop. Here is a big empty space. I tried X+CMD and then V+CMD and it does not work for me.
Does anyone know of any other solution?
Greetings,
Tomas
Don’t hide the repeater. Make it collapse.
Inside the if condition (that checks if it’s desktop), use this line:
$w("#repeater1").collapse();
I can’t reed the screenshot. It’s too small. Please post the code itself and not a screenshot.
$w.onReady(function () {
if (wixWindow.formFactor === "Mobile") {
$w("#repeater").show();
$w("#pagination1").show();
$w("#naslovnavrstica").show();
$w("#text101").show();
$w("#text102").show();
$w("#text103").show();
}
if (wixWindow.formFactor === "Desktop") {
$w("#repeater").collapse();
$w("#pagination1").collapse();
$w("#naslovnavrstica").collapse();
$w("#text101").collapse();
$w("#text102").collapse();
$w("#text103").collapse();
}
});
No idea. Your code should make it collapse if it’s desktop.
You’re probably not in the form factor you think you are in. After the onReady console log the form factor to check:
let formFactor = wixWindow.formFactor;
console.log(formFactor);
So? It dows not work. 
$w.onReady(function () {
let formFactor = wixWindow.formFactor;
console.log(formFactor);
if (wixWindow.formFactor === "Mobile") {
$w("#repeater").show();
$w("#pagination1").show();
$w("#naslovnavrstica").show();
$w("#text101").show();
$w("#text102").show();
$w("#text103").show();
}
if (wixWindow.formFactor === "Desktop") {
$w("#repeater").collapse();
$w("#pagination1").collapse();
$w("#naslovnavrstica").collapse();
$w("#text101").collapse();
$w("#text102").collapse();
$w("#text103").collapse();
}
});
@pocaktomas
what was logged in the console ?
@mikemoynihan99 What do you mean? I don’t understand the question.
@pocaktomas you added code to log information in the console… What did it log when you executed the code?
@mikemoynihan99 you told me to add this code. I don’t know exactly what this is all about.
@pocaktomas When it comes to coding console logging information is very very very basic, it logs information in the console. You read the console to see what information is logged.
@pocaktomas Have you got your import for wix window at the top of your code?
Also, can you not put the all the separate elements into a box or container for example so that they are all grouped and attached to the one element, so that you only have to add that one container etc to your code?
If you are only wanting it to show on mobile only, then just write it for mobile only, don’t need to bother with the desktop code.
https://www.wix.com/corvid/reference/wix-window.html#formFactor
https://support.wix.com/en/article/corvid-writing-code-that-only-runs-on-mobile-devices
https://support.wix.com/en/article/corvid-tutorial-displaying-elements-in-mobile-only
Something like this for mobile only.
import wixWindow from 'wix-window';
$w.onReady(function () {
if(wixWindow.formFactor === "Mobile"){
$w("#repeater").show();
$w("#pagination1").show();
$w("#naslovnavrstica").show();
$w("#text101").show();
$w("#text102").show();
$w("#text103").show();
}
});
//Make all desktop items set to hidden on load on desktop editor.
Or for just the one container…
import wixWindow from 'wix-window';
$w.onReady(function () {
if(wixWindow.formFactor === "Mobile"){
$w("#containerbox").show();
}
});
//Make all desktop items set to hidden on load on desktop editor.
Show On Mobile Only
This works perfectly, however it only works on published site.
IT DOES NOT SHOW CORRECTLY ON PREVIEW.
If you want to test how your code works on mobile devices, you’ll need to publish your site and view the published version on a mobile device or in a mobile device emulator.
Warning:
If you preview your site, it will always behave as if it is being viewed on a desktop device, even if you preview from the mobile editor.
Velo: Writing Code That Only Runs on Mobile Devices | Help Center | Wix.com