Youjoomla Support Forums (https://www.youjoomla.com/joomla_support/index.php)
-   YJSG Template Framework Plugin (https://www.youjoomla.com/joomla_support/forumdisplay.php?f=269)
-   -   [SOLVED] Cannot get responsive classes to work on mobile menu (https://www.youjoomla.com/joomla_support/showthread.php?t=13151)

achartier 10-03-2014 01:17 PM

[SOLVED] Cannot get responsive classes to work on mobile menu
 
I am trying to add responsive classes to my menu items in the Link CSS Style under the Link Type Options. For Desktop and Medium they seem to work. I can use hidden-lg and hidden-md (or the visible equivalents) and they seem to react properly based on the screen size.

Problem I have is none of the classes have any effect when the menu switches to mobile view. Have I missed something? Is this the way it is supposed to work? If so how do we hide/show menu items in mobile view based on screen size?

Thanks.

Are you sure your are posting in product assigned forum?: Yes

What is your CMS version?: Joomla 2.5

MySQL Version: 5.x

PHP version: 5.x

Link to installation: unavaliable

Have you edited any files? If yes tell us which ones.: No

Is this personal or client website?: Personal

neo 10-04-2014 06:27 AM

add to suggestions please
https://github.com/YJSGframework/yjsg/issues

reason why it does not work is because the menu you see on mobiles is a select and it did not inherit the class you added

achartier 10-04-2014 06:53 AM

I have added it. Hope the description makes sense.

achartier 10-06-2014 03:56 PM

The update from today fixed the problem. I have a follow on issue though.

There does not seem to be a correlation between the visibility size options and when the menu actually switches to dropdown mode. I have a menu item with visibility-lg (desktop) but I can shrink my browser window to a point where the menu switches but the menu item is still visible in the dropdown list. I refresh my browser and clear cache without any impact.

Is there a configuration setting for this somewhere that I can make these sizes match the menu switch?

Thanks.

neo 10-06-2014 04:03 PM

menu switches on 979 px , bootsrtap is doing switch for visible-lg on 992
so they are 7px apart and note that YJSG was not build on bootstrap , it just lets you use it

what I would do is this in custom.css

Code:

@media screen and (max-width: 979px) {
  .hide_menu{
    display:none;
  }
}

and use hide_menu class instead bootstrap class names

achartier 10-06-2014 04:35 PM

When I first implemented the above css it seemed to work but as soon as I refresh the page the menu item is back. It appears to have something to do with the system cache because if I clear the cache and then refresh the menu item disappears, but once I refresh again (without clearing cache) it returns. I tried this 5-6 times with the same results.

achartier 10-06-2014 07:14 PM

Upon further testing the patch to correct the mobile menu is not working. The css class is not propagating to the select option list (I'm not even sure it can, I'm no expert). I have included hidden-xs and hidden-md on the css for the last login menu option shown in the following screen grab: Screenshot by Lightshot

As you can see, none of the css selectors are included. I am running version 2.1.1 of the plugin.

neo 10-07-2014 06:07 AM

1.Screenshot by Lightshot
2.Screenshot by Lightshot
3.Screenshot by Lightshot
4.Screenshot by Lightshot
5.Screenshot by Lightshot

achartier 10-07-2014 07:36 AM

OK. I tried this on the Eximium demo install and it does work. Also the standard bootstrap classes also seem to work. There must be something on my site causing the issue. I will pursue.

Sorry, I should have tested this on the vanilla demo first. I will do so in the future before reporting an issue.

neo 10-07-2014 07:43 AM

I think you moved overrides to template because of nonumber framework right?
remember to update them, yjsg_mobilemebu.php in particular
https://github.com/YJSGframework/yjs...mobilemenu.php


All times are GMT -4. The time now is 02:27 PM.

Powered by vBulletin®
Copyright ©2000 - 2023, Jelsoft Enterprises Ltd.