Problem with dropdowns in Chrome, Firefox


Topic: Problem with dropdowns in Chrome, Firefox

I am creating a small project and for the front end I chose to use Material Design BootStrap (with jQuery), since I like those designs more than the standard BootStrap. Until now everything had worked correctly, but I noticed a strange behavior with one element: the drop-down lists. When you click on a list, it is displayed, but then there is no way to close it again, that is, to do the show / hide function when there is a selection, or when you click somewhere. It just stays open. The only way to close it is to refresh the page. This happens to me even on the MDBootstrap page (on my personal computer). (https://mdbootstrap.com/docs/jquery/navigation/navbar/).

Well, some additional data: So far I had done my tests using the latest version of Chrome. I found it strange that such elementary functionality did not work even on the website of its creators. Then I tried Firefox, the same problem. Today in the morning while working, I decided to open the MDBootstrap page on my work computer, and to my surprise the drop-down lists worked correctly! I also did the test on a MacBook with Chrome, entering the same page and it also worked. I even tried from a virtual machine, and in the Chrome of this VM the drop-down lists worked!

In summary, MDBootstrap drop-down lists do not work, so far, in Chrome or Firefox on my personal computer at home. It occurred to me that it could be the extensions of those browsers that were causing some conflict with that element, but I uninstalled and reinstalled both browsers, and the problem persists. I have tried incognito mode with these browsers and it does not work. I tried Internet Explorer and Vivaldi, and in these if the drop-down lists work. Everything is so confusing!

What would be the possible cause of the problem, and how could I solve it?


Marta Szymanska staff pro premium answered 3 years ago

Hi,

I don't see the problem with the closing dropdown in the navbar in our documentation. Would you point out a particular place where the problem exists? And for the other problems, would you create a snippet showing the problem here: https://mdbootstrap.com/snippets/? The easiest way for me to help you is to see your code and check what is wrong and try to fix a particular code.

Best, Marta


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.8
  • Device: Acer Laptop
  • Browser: Chrome, Firefox
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes