Problem returns: Bootstrap menu stays open in collapsed mode  

This sub-forum is for discussing and reporting bugs on any content that is not available by default in Panotour, so this concerns custom HTML templates, extra plugins (both Kolor-provided and third-party), etc...

Ce sous-forum a été créé pour discuter et/ou rapporter des bugs sur tout contenu qui n'est pas disponible par défaut dans Panotour, donc cela concerne les templates HTML customisés, plugins supplémentaires, etc...
User avatar
pgielen
Member
 
Topic author
Posts: 158
Likes: 7 posts
Liked in: 5 posts
Joined: Wed Mar 12, 2008 11:43 pm
Location: The Netherlands
Info

Problem returns: Bootstrap menu stays open in collapsed mode

by pgielen » Mon Jan 09, 2017 1:16 pm

In october, I marked a question SOLVED about the bootstrap menu in condensed mode staying open after a click on a submenu item. But more problems turn up.

The original thread was here: http://www.kolor.com/forum/viewtopic.php?f=116&t=33810

The solution, which was posted by global moderator oblanc was to add a bit of code before the </body> tag in the tours html file. Like this:

Code: Select all
<script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery('.navbar li.dropdown li a').on('click',function(){
            jQuery('.navbar button[data-toggle]').click();
        });
    });
</script>


However, now that I am working on another site which also has a Bootstrap menu, but no submenus, the problem comes back.

A draft version of this tour can be found on http://vrnldev.panoworld.nl/vanhemert/

In this site, there are only 4 main menu items to be chosen from, no submenu items. In collapsed mode (when the screen width is reduced), I can click any of the 4 items and the corresponding pano loads, but the menu stays open. Needless to say, I added the code mentioned above, but that does not help. How to proceed?

Pierre

User avatar
oblanc
Moderator
 
Posts: 27
Likes: 1 post
Liked in: 3 posts
Joined: Tue Mar 25, 2014 10:46 am
Info

Re: Problem returns: Bootstrap menu stays open in collapsed

by oblanc » Mon Jan 09, 2017 1:53 pm

Hello
the selector is wrong try this
Code: Select all
jQuery('.navbar .navbar-collapse.collapse.in li a').on('click',function(){
    jQuery('.navbar button[data-toggle]').click();
});

User avatar
pgielen
Member
 
Topic author
Posts: 158
Likes: 7 posts
Liked in: 5 posts
Joined: Wed Mar 12, 2008 11:43 pm
Location: The Netherlands
Info

Re: Problem returns: Bootstrap menu stays open in collapsed

by pgielen » Mon Jan 09, 2017 2:22 pm

I have implemented it in http://vrnldev.panoworld.nl/vanhemert/, but it still does not work.

User avatar
pgielen
Member
 
Topic author
Posts: 158
Likes: 7 posts
Liked in: 5 posts
Joined: Wed Mar 12, 2008 11:43 pm
Location: The Netherlands
Info

Re: Problem returns: Bootstrap menu stays open in collapsed

by pgielen » Wed Jan 11, 2017 9:03 am

I just experimented a bit with the code and found out that changing "li.dropdown" into ".navbar-collapse.collapse.in" does not work. However, simply changing it to ".navbar-collapse" does.

So now mycode is:
Code: Select all
<script type="text/javascript">
         jQuery(document).ready(function(){      
            jQuery('.navbar .navbar-collapse li a').on('click',function(){
               jQuery('.navbar button[data-toggle]').click();
            });
         });
</script>

I just wonder why this does not work with submenus and we need two solutions. So, if submenus and no submenus are mixed, there will be a problem.

Pierre

no avatar
grismann
New member
 
Posts: 8
Likes: 0 post
Liked in: 0 post
Joined: Wed Jul 26, 2017 1:45 pm
Info

Re: Problem returns: Bootstrap menu stays open in collapsed

by grismann » Thu Mar 22, 2018 12:43 pm

Hi Pierre,

I had the same problem. I figured it out editing the "bootstrap.mini.js" file.
I add this code ad the end of the javascript file:

Code: Select all
// MODIFICATION: Close responsive navbar automatically
  // ==============

$('.navbar-collapse a:not(.dropdown-toggle)').click(function(){
    $(".navbar-collapse").collapse('hide');
});


Some more extended answers:
https://stackoverflow.com/questions/16680543/hide-twitter-bootstrap-nav-collapse-on-click
https://getbootstrap.com/docs/3.3/javascript/

I have not checked if it works with no submenus.

Ferran


Who is online

Users browsing this forum: No registered users and 1 guest