Desktop Menu vs Mobile Menu under certain screen resolution

Ask the community
,
1

I’ve been trying to find an answer via google but have come up short too often. If a person is browsing on a monitor or at a resolution under a specific size, is there a way to make the site swap to the mobile version or mobile menu?

I currently have this set in place to get rid of a text box and replace it with a logo under 1100px but would like to convert the menu to the mobile menu, or just have the entire site load in the mobile format.

// The code in this file will load on every page of your site

import wixWindow from 'wix-window';

$w.onReady(function () {

 let fadeOptions = {
 "duration": 1000,
 "delay": 0,
    }

    wixWindow.getBoundingRect()
    .then(winInfo => {
 let winHeight = winInfo.window.height;
 let winWidth = winInfo.window.width;
 if (winWidth < 1100 ) {
            $w("#text167").collapse()
            $w("#image181").show("fade", fadeOptions)
        }
 if (winWidth > 1100) {
            $w("#image181").collapse()
        }
    })
 // Write your code here
});

Any help would be greatly appreciated! Thank you!