[fishParticipant]

Hello

Would it possible without slaughtering the core code of X theme to insert the option to hide or display certain menus on mobile devices and or tablets?

It would be a huge bonus and really make X stand above the rest. “no competition” Considering the popularity of mobile devices and possible increase in watch size monitors usage this is something all website owners / developers should be planing for, primarily the watch size monitors. “eventually they will take off”

If X had the above option it would be the ultimate versatile theme because you could basically design a complete App ( look feel and functionality ) without having pay some over priced IOS developers 10k up to do the same thing..

Question 1) Is this possibly at the current time via editing the files?

Question 2) If the above is not possible will it possibly be available in the future with X?

I myself would be happy to pay for that option..

Just a recommendation really.

Have a wonderful day
Fish

[RadModerator]

Hi Fish,

Thanks for writing in.

That’s doable through css, for example, you wish to display mobile menu at 1200px screen resolution regardless of device (mobile or desktop). Then css should be like this :

@media ( max-width: 1200px ) {

.x-nav-wrap.desktop {
display: none;
}

.x-nav-wrap.mobile {
display: block;
}

.x-btn-navbar {
display: block;
float: right;
}

}

Or display mobile menu on all touch devices, even it has resolution of 1980px. (eg. tablets).

.touch .x-nav-wrap.desktop {
display: none;
}

.touch .x-nav-wrap.mobile {
display: block;
}

.touch .x-btn-navbar {
display: block;
float: right;
}

And to hide the mobile menu on mobile for specific size or for touch devices, then it’s just the reverse of above css. You will have to change display none to block, and block to none.

Hope this helps 🙂

[fishParticipant]

Hi thank you very much for the snippet.

The code works great the only bug is the menu is loading in the open position. Do you have snippet of CSS to stop that?

https://xcurrent.org

Thank for your time…
Fish

[RadModerator]

H Fish,

Thanks for writing in.

Add this 🙂

.touch .x-nav-wrap.mobile.collapse {
height:0px;
}
.touch .x-nav-wrap.mobile.collapse.in {
height:auto;
}

Cheers!

[fishParticipant]

Hi
Thank you again for taking the time to help me try to figure this out.

The reason it’s is / was so important is that my menu breaks between 1067px and 966px. The parent menu shifts under logo thus causing the mega-menu to cover the parent menu between 1067px and 966px. At 966px the mobile menu appears and works fine.

So between 1067px and 966px the menu is not functioning correctly. The mega menu covers the parent when activated..

Below is the CSS I’m using, I have tried adjusting the media max-width but nothing I try seems to correct this issue..

Quick Note; I’m not even sure they make a mobile device with a screen that size? I’ve searched the topic and found nothing so I’m starting to think I can just disregard this issue as nobody would possible be viewing the site at the above px size except for possibly on a very rare occasion.

/*------------------mobile--menu----------------*/

@media ( max-width: 960px ) {

.x-nav-wrap.desktop {
display: none;
}

.x-nav-wrap.mobile {
display: block;
}

.x-btn-navbar {
display: block;
float: right;
}

.touch .x-nav-wrap.desktop {
display: none;
}

.touch .x-nav-wrap.mobile {
display: block;
}

If you cannot think of any devices off the top of your head that requires the above screen size I guess we can just disregard this.

Thank you for your assistance
Fish

[ChristopherModerator]

Hi there,

Instead of current CSS you have add this one :

@media (max-width:1067px) and (min-width:979px){

.x-navbar .desktop .x-nav>li>a{
letter-spacing:normal;
}

}

Hope it helps.

[fishParticipant]

Hi

Unreal!!

X- could probably make small fortune training other service providers online how to handle their support team properly to truly make their customers happy…:-)

The last snippet worked like a dream the menu switches on the exact pixel needed….

I couldn’t be more satisfied with the X-theme, support, code quality just to mention a few… I’ve speant a few thousand dollars in the Envato marketplace over the past 4-5 years but have yet to purchase an item with support and quality X offers…

GREAT JOB!

Thanks for your time and have a great day.
Fish

[Paul RModerator]

You’re most welcome and Thank you for your kind words.

[Author]

Posts