<meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script type="text/javascript">
$("#theButton").css("display", "none"); $(document).click(function (event) { var target = $(event.target);
$(".dropdown-toggle").css("visibility", "hidden"); $(".navbar-toggle").css("display", "none") $("#theButton").css("display", "block"); else if (!target.is("button")) { alert("You need to View in Full Screen, so you can click in the body, which is below the Navigation. You clicked " + event.target.nodeName) $("#theButton").click(function () { $(".dropdown-toggle").css("visibility", "visible"); <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="navbar-header nav-tabs" style="border-bottom:none;">
<button id="theButton">Toggle navigation</button>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right" style="padding-top:20px">
<a href="" class="dropdown-toggle" data-toggle="dropdown">
Information <span class="caret"></span>
<ul class="dropdown-menu">
<a href="/Home/Terms">Terms & Conditions</a>
<a href="/Home/Privacy">Privacy Policy</a>
<a href="/Home/ContactUs">Contact Us</a>
