home.html

<!DOCTYPE html>
<html>

<head>

  <meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1">
  <title>MWE-NavBar</title>

  <!-- SOURCE W3 CSS  -->
  <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">

  <!-- SOURCE AWESOME FONT -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

  <!-- SOURCE HOVER -->
  <link rel="stylesheet" href="./Hover-master/css/hover.css">


  <!-- SOURCE JQUERY -->
  <script src="jquery-3.1.1.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  <!-- SOURCE FONTS -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">

  <!-- SOURCE OUR FUNCTINOS -->
  <script src="functions.js"></script>

  <!-- SOURCE OUR VARIABLES -->
  <script src="variables.js"></script>

  <!-- SOURCE OUR STYLES -->
  <link rel="stylesheet" href="style.css">

</head>

<style media="screen"></style>

<body>

  <div class="w3-container w3-section" ><ul id="navBar" class="w3-navbar w3-center"></ul></div>


  <script>
    var windowWidth = jQuery(window).width();           //Get current window's width
    renderNavigationBar(pages,"navBar", windowWidth);   //Generate initial navigation bar
  </script>


  <script type="text/javascript">
    var windowWidth;

    jQuery(document).ready(function(){}); // NEEDED for resize to work... for some reason...
    jQuery(window).resize(function () {
      windowWidth = jQuery(window).width();   // We want the resized width
      renderNavigationBar(pages,"navBar", windowWidth);
    });
  </script>


</body>

</html>