Create custom dropdown using jQuery, but you will need the bootstrap css or at least code of bootstrap dropdown which exists in the bootstrap css. So it will help to make it work.
Purpose behind this dropdown is you can add anything in this dropdown and this will not close till you click outside of it.
Here is html code for that
<div class="dropdown"> <a href="#" data-toggle="at-custom-dropdown">Menu Toggle</a> <ul class="dropdown-menu"> <li>This is first menu</li> <li>This is second menu</li> <li>This is third menu</li> <li>This is fourth menu</li> <li>This is fith menu</li> </ul> </div>
Here is script for that.
$('[data-toggle="at-custom-dropdown"]').on('click', function(){ $(this).closest('.dropdown').toggleClass('open'); }) $('body').click(function(e){ var clickedOn = $(e.target); if (clickedOn.closest('.at-custom-dropdown').length){ //Inside }else{ //Outside $('.at-custom-dropdown').removeClass('open') } });