I have provided a solution that you can’t manage to work, sorry i don’t have another one for you unless you’ll wait for a new update.

let me remind you that it is your responsibility to make this functionality work OUT OF THE BOX (as other top templates have done) – but surely – thank you – will see if we can make it work..

Let me remind you that i don’t care what other authors have implemented and how, i’ve already described their solution and mentioned that i don’t want to improve this thing using any of those solutions. And i CAN’T fix lack of browser functionality, i CAN’T add missing mouse events to mobile browsers and i CAN’T publish solutions that are not properly tested and 100% confirmed. My responsibility is to deliver a DESKTOP html template, which is responsive, but not mobile-first application. For this kind of templates you need to look at HTML > Mobile category. This issue was reported and solution will be provided in upcoming update. Period.

when is the next release planned?

forgot to mention that the submenus open but DO NOT CLOSE – do you think there might be a js conflict?

maybe you can do a very quick test to see if this plugin is compatible with your template?

I guess you only need to add these two lines to one of your pages to test it (can you add it and see if it works??):

<!-- Dropdowns enhancement -->
<link href="https://behigh.github.io/bootstrap_dropdowns_enhancement/css/dropdowns-enhancement.css" rel="stylesheet">

<script src="https://behigh.github.io/bootstrap_dropdowns_enhancement/js/dropdowns-enhancement.min.js"></script>

and Add class .dropdown-submenu to items with sub-menu.

Yes, i’ve tested that menu locally and everything seems to work fine on my side. Don’t forget to add class=”dropdown-toggle” data-toggle=”dropdown” to all submenu links.

.dropdown-submenu class is the default class name of submenus, CSS file is not this important.

ok thank you Eugene let me try

please can you post the file that you tested on fiddle – changed everything and still the submenus refuse to close…they refuse to close on the native menu as well – which I copied from the demos…

check this page on your mobile, top navbar > Levels menu and submenus. Works fine on iphone

thank you – it works but it does not work with the native APP.JS file which is included in your latest release – have you modified this file? do I need to download the updated file from your demo page?

the one you are using on your site is Version: 1.3 -while the one included in your template is Version: 1.2

please see the comparison report at https://jsfiddle.net/x73nbt71/

I did manage to create a working menu with your help – please do include this change in the new update!)

Hi – Yes, but partially due to browser limitations.

can you show me an example of such vertical side menu please – cannot find it in the demo…

Answering support requests can take up to 1 day, please be patient.

Icons – what is that? I mean a link. here is a list of available icons, where you definitely can find at least 5 different icons for chat.

Thanks

yes…glad to see you back) I could not find an icon for CHAT – how do I get it?

I disabled background to even show active highlighting (previously it did not appear) :

  }
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #fff;
    /*background-color: rgba(0, 0, 0, 0.15);*/

I need to add that the dropdown is generated by BUTTON…maybe this is due to the fact that the button keeps in the PRESSED state when the dropdown is shown?

Hi

By default tooltip is initialized on hover, so when you click the button, your cursor is still over the button. You can force it to close by using

$('#element').tooltip('hide');

method attached to a button onClick event.

Thanks

thank you – where do I put this code in this line:

<button type="button" class="btn border-grey-300 text-grey-300 btn-flat dropdown-toggle" data-toggle="dropdown" area-expanded="false" data-popup="tooltip" title="Related Instruments" data-placement="bottom"> RELATED <span class="caret" /></button>

Nowhere, it’s a JS code, not a markup. It depends on your code structure, i have no idea where and how you structure and store your code. Please refer to Bootstrap documentation for more information.

actually I need to add that when the drop down menu initiated from a BUTTON is open and the CURSOR is AWAY the tool-tip still stays open… this does NOT happen wit the drop-down menus initiated from Icon…

Example of the drop-down menu wih tooltip:

https://jsfiddle.net/sjrbkh02/

is this the default behaviour?

is the only workaround to REMOVE links from the menu items which open submenus?

It works just fine on iphone, but doesn’t work on android. The reason is mobile browsers don’t support hover events. So there is no a fully working solution at the moment. I have tried to add some JS magic with mouseenter/mouseleave events, you can try to play with them and replace with click or touchstart/touchend events. I’ll dive deeper into this issue in the upcoming update.

Thank you Eugene – this is just very bad for sure….I was thinking the menus would work on mobiles out-of-the box….I absolutely need a working solution – can you recommend any certain fix? cannot play right now…

Yep, default solution for all submenus is controlled by display: none; and display: block; on list item hover. But mobile browsers don’t support it, so basically you can’t do much here except removing styling attributes and replace them with JS stuff. Here is my solution, which is still working partially:

if($(window).width() <= 768) {

    // Add mouse events for dropdown submenus
    $('.dropdown-submenu').on('mouseenter', function() {
        $(this).children('.dropdown-menu').addClass('show');
    }).on('mouseleave', function() {
        $(this).children('.dropdown-menu').removeClass('show');
    });
}

Here you can try to replace mouseenter/mouseleave with something else. But it definitely needs more testings and time to find a proper way to do it.

thank you. please check this menu - https://getbootstrap.com/examples/navbar/ it works on Android mobile – is it on a different version of bootstrap?

Bootstrap doesn’t have dropdown menu with multiple levels, i’ve added it separately.

Thank you – do you think this can be implemented? http://jsfiddle.net/chirayu45/e02t2jcc/1/

Yes, it is possible. But keep in mind that you’d need to clean up CSS as well.

Dear Eugene – can you also please take a look at this more advanced multi-menu script – do you think this can work easily with your template? https://www.smartmenus.org/

see some demos here https://www.smartmenus.org/about/themes/

can you try this navbar in your temple together with this plugin? it seems to work but the caret looks ugly….

• Link
• Link
• Link
• Dropdown
  • Action
  • Another action
  • Something else here
  • Nav header
  • Separated link
  • One more separated link
    • Action
    • Another action
    • A long sub menu
      • Action
      • Something else here
      • Disabled item
      • One more link
      • Menu item 1
      • Menu item 2
      • Menu item 3
      • Menu item 4
      • Menu item 5
      • Menu item 6
      • Menu item 7
      • Menu item 8
      • Menu item 9
    • Another link
    • One more link

this navbar is from bootstrap-navbar.html from demo folder of this plugin….if you could impelemnt this – your template woudl be even more awesome!)

I checked your MEGA menu in layout_navbar_main_fixed.html and it works perfectly on Android- does it work on all devices? Glad you managed to implement a working menu!!!

Ok I now understand that this is just plain NOT working – when do you think you can provide a working, responsive MOBILE multi-level menu like you see for example here http://keenthemes.com/preview/metronic/theme/admin_1/layout_full_width.html

This IS KEY FUNCTIONALITY and I am not sure why I need to search for all the fixes when all of your top competitors here have already implemented a working solution – aside from that your template is beautiful!)

As i mentioned earlier, solution for multilevel menu will be provided in version 2.0, if you can’t wait – feel free to implement it yourself.

This is NOT a key functionality and this is NOT a bug, this menu is fully CSS driven and NOT fully supported by mobile browsers. This means i need to add a JS hack to detect mobile device and add/remove certain functionality attached to the resize event. This is NOT a perfect UX.

I am very happy for all of my competitors and i am sorry, but i don’t remember that you’ve tried to search for the fix yourself. You ask me if that’s possible to integrate different plugins and ask me to find a solution for you asap, and you don’t read the documentation of all available components. This is what frustrates me the most.

Eugene I am not trying to frustrate you – my project is blocked because the menu DOES NOT WORK IN MOBILE..this i KEY FUNCTIONALITY for the people who try to create the mobile apps and need multi-level menu..now please tell me how to best fix this – cannot wait for release 2.0. Please at least point me to a working solution which will help open the menus on CLICKs…I tried this plugin and it does not work…http://vadikom.github.io/smartmenus/src/demo/bootstrap-navbar.html

Item doesn’t work the way it should

If an item doesn’t work the way it should and can’t easily be fixed you are entitled to a refund of the item. This includes situations where the item has a problem that would have stopped you from buying it if you’d known about the problem in the first place. If the item can be fixed, then the author is required to do so promptly by updating the item otherwise you are entitled to a refund of that item.

https://themeforest.net/page/customer_refund_policy

please read the last sentence

author is required to do so promptly by updating the item

and please do not take it personally – I like your template – it just does not work as I thought originally…

I am lost as to how to make the menu work – I absolutely need it to work – what you think of this plugin http://mmenu.frebsite.nl/ can it be implemented?

First of all, there is a clear difference between mobile application and responsive desktop application. Limitless is a desktop application first, it’s not a mobile template, which is clearly visible in the category where it’s selling.

Second off, as already being said, this is NOT a bug, because it works great in desktop browsers, as it should. Due the fact that mobile browsers support mouse events only partially, some features may not work as in desktop browsers. Anyway, this is not going to happen until 2.0 is released, because any solution needs a proper testing and deeper dive into the browser specs and i am currently focused on more important things. The best one is to replace mouseenter/mouseleave with click event, but this requires quite a lot of changes in core layout JS.

You can try this extension to make it work, but my solution won’t include it as i don’t want to use third-party extensions where possible.

mmenu – definitely won’t be easy to implement, it requires significant changes in template structure and will be released in 2.0 as a separate layout.

responsive desktop application MEANS YOU TEMPLATE WILL ONLY BE RESPONSIVE AT VARIOUS DESKTOPS and not MOBILES???

AND YES PLEASE please acknowledge that this sentence at your demo pages implies that your template will work great on mobiles as well:

Limitless template is fully responsive, which means that it looks perfect on mobiles and tablets.

Thank you for that link – will try it today…

3 main things of responsive design – proportion based grid, CSS and images. Javascript is supported ONLY partially! This means all major mobile browsers will DISPLAY the website properly, but due to mobile browser limitations some features may NOT work on mobiles, but DO work on desktop. To make it 100% mobile ready, developers have to add JS hacks in order to make them work correctly and overall this is not a good idea, that’s why i can’t and don’t want to post any workarounds and try to avoid such solutions.

If you need to create mobile app, take a look at jquery mobile or similar libraries, they do support all necessary patterns.

I do not need an app I need a website which works great everywhere – ok talk later- I understand that you refrain from other scrips but I need a working solution as soon possible and Metronic and Remark both have it – using the custom scripts – I do not care if it is a custom script or not – I just need it to work NOW!

Hi

I’ve just downloaded the package twice and unpacked it successfully. Also i didn’t receive any notices from users that they have problems with the latest template version.

Something similar happened before and the solution was to use winzip/7zip or other third-party tools instead of native one. The package contains quite a lot of files, so sometimes native tools can crash or unpack partially. The real reason is still unknown.

Thanks

Tried extracting on three different Windows 10 computers using built in zip/unzip. Also tried a corporate managed computer. I really think you need to try opening it on a Windows 10 machine without third-party tools.

OK, thank you.

I also wanted to ask how do I make the icon labels the same size as text labels – they are of the different fonts – so I just need to experiment with the font sizes?

Hey

Well using such elements inside headings is semantically wrong, you need to use them outside h4 tag.

Labels and buttons have absolutely different purpose – labels are for small contextual highlights, buttons are for some actions. So it’s not possible to use them both inline as by default they have different heights. Wondering, why don’t you want to use button with dropdown instead of label? Their styling is pretty much the same.

Button group doesn’t have any margins, unless they are inside button toolbar.

Thanks

Thank you – lets start with the button group – I thought the two labels (one simple and one with drop-down would align perfectly together)

you will see the white space around the button group – CHROME cannot find which CSS property adds this white space

another question is how do I add multiple elements in one line starting from the H4 tag at the page header – if I place the labels and dropdowns not in H4 tag but one after another they do NOT align

I replaced the label drop down with BUTTON dropdown and it looks more aligned now – wanted to ask how do I make the button FLAT AS LABEL – did nto find the flat buttons…

I honestly don’t understand what you want to achieve. Of course they are not aligned properly, because labels have 16px less height than buttons. As being said, if you keen to use buttons inside h4 tag, keep in mind that most likely you’ll need to adjust line height and/or your heading and buttons will be misaligned. To solve this issue, you can try to add floating to the heading and place buttons outside the heading.

You can find flat buttons style on this page.

Thank you so if I place a flat button and a flat button dropdown these will be aligned right?

And if I add the left align I can place as many elements as I need and these will aligng with the heading?