Add Bootstrap hover dropdowns and make dropdown-toggle item clickable.1. Just don't add `data-toggle="dropdown"`2.1 JS: Load this code (hover-navbar.js)2.2 CSS: Add this code (hover-navbar.css)(not both, just one of them)

hover-navbar.js

(function ($)
{
    "use strict";

    $(".navbar .nav")
        .on("mouseenter", "li.dropdown", onMouseEnter)
        .on("mouseleave", "li.dropdown", onMouseLeave);

    /**
     * Callback on mouse enter
     *
     * @param event
     */
    function onMouseEnter (event)
    {
        showDropdown( $(event.currentTarget) );
    }


    /**
     * Callback on mouse leave
     *
     * @param event
     */
    function onMouseLeave (event)
    {
        hideDropdown( $(event.currentTarget) );
    }


    /**
     * Shows the dropdown of the given element
     *
     * @param $li {jQuery}
     */
    function showDropdown ($li)
    {
        $li.children(".dropdown-menu").show();
    }


    /**
     * Hides the dropdown of the given element
     *
     * @param $li {jQuery}
     */
    function hideDropdown ($li)
    {
        $li.children(".dropdown-menu").hide();
    }

}(jQuery));

hover-navbar.scss

.navbar .nav li.dropdown:hover {
    .dropdown-menu {
        display: block;
    }
}