title: Bootstrap Modal Not Displaying
body: <p>i need help with my modal it just will not display. i can't seem to find what is wrong.
  below is the code</p>
  
  <pre><code> &lt;body&gt;
      &lt;!--[if lt IE 7]&gt;
          &lt;p class="chromeframe"&gt;You are using an &lt;strong&gt;outdated&lt;/strong&gt; browser. Please &lt;a href="http://browsehappy.com/"&gt;upgrade your browser&lt;/a&gt; or &lt;a href="http://www.google.com/chromeframe/?redirect=true"&gt;activate Google Chrome Frame&lt;/a&gt; to improve your experience.&lt;/p&gt;
      &lt;![endif]--&gt;
  &lt;div class="navbar navbar-inverse navbar-fixed-top"&gt;
    &lt;div class="container"&gt;
      &lt;div class="navbar-header"&gt;
        &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span class="icon-bar"&gt;&lt;/span&gt;
          &lt;span&gt;&lt;img src="img/logo.png"&gt;&lt;/span&gt;
        &lt;/button&gt;
          &lt;a class="navbar-brand" href="#"&gt;Cotton Board of Zambia&lt;/a&gt;
      &lt;/div&gt;
      &lt;div class="navbar-collapse collapse"&gt;
        &lt;ul class="nav navbar-nav"&gt;
          &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#about"&gt;About&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;
  
        &lt;/ul&gt;
        &lt;form class="navbar-form navbar-right"&gt;
          &lt;div class="form-group"&gt;
            &lt;input type="text" placeholder="search" class="form-control"&gt;
          &lt;/div&gt;
  
          &lt;button type="submit" class="btn btn-success"&gt;Search&lt;/button&gt;
  
  
      &lt;/form&gt;
  
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code> &lt;table id="maintable" &gt;
       &lt;tr&gt;
           &lt;td&gt;
              &lt;table align="left" width="100%"&gt;
                  &lt;tr&gt;
                      &lt;td&gt;&lt;p&gt;&lt;a data-toggle="modal" href="#reglog" class="btn btn-primary btn-large"&gt;Register &amp; Login&lt;/a&gt;&lt;/p&gt;&lt;/td&gt;
                      &lt;td&gt;
                      &lt;!--register/login modal--&gt;
                          &lt;div class="modal hide fade in" id="reglog"  style="display: none; " &gt;
                          &lt;div class="modal-header"&gt;
                          &lt;h4&gt;Cotton Board of Zambia&lt;/h4&gt;&lt;br&gt;
                          &lt;h6&gt;Login Here&lt;/h6&gt;
                          &lt;/div&gt;
                          &lt;div class="modal-body"&gt;
                              &lt;form&gt;
                              &lt;label&gt;Some text&lt;/label&gt;
                              &lt;input type="text"&gt;
  
                              &lt;/form&gt;
  
  
                          &lt;/div&gt;
  
                          &lt;div class="modal-footer"&gt;
                          &lt;button class="btn" data-dismiss="modal" aria-hidden="true"&gt;close&lt;/button&gt;
                          &lt;a href="#" class="btn" data-dismiss="modal"&gt;Close&lt;/a&gt;  
                          &lt;/div&gt;
  
  
                          &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"&gt;&lt;/script&gt;  
                          &lt;script src="/js/modal.js"&gt;&lt;/script&gt;  
  
  
  
                      &lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/table&gt;
           &lt;/td&gt;
           &lt;td&gt;
               &lt;table align="right" width="100%"&gt;
                  &lt;tr&gt;
                      &lt;td&gt;
                          &lt;div&gt;&lt;h3&gt;Our Location&lt;/h3&gt;&lt;/div&gt;
                    &lt;div id="map"&gt;
                       &lt;div id="map_canvas" style="width: 200px; height: 300px;"&gt;&lt;/div&gt;
                     &lt;/div&gt;
                      &lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/table&gt;
           &lt;/td&gt;
       &lt;/tr&gt;
    &lt;/table&gt;
     &lt;div&gt;&lt;hr/&gt;&lt;/div&gt;
    &lt;footer&gt;
      &lt;p&gt;&amp;copy;  2013&lt;/p&gt;
    &lt;/footer&gt;
  &lt;/div&gt; &lt;!-- /container --&gt;        &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.js"&gt;&lt;/script&gt;
      &lt;script&gt;window.jQuery || document.write('&lt;script src="js/vendor/jquery-1.10.1.js"&gt;&lt;\/script&gt;');&lt;/script&gt;
  
      &lt;script src="js/vendor/bootstrap.min.js"&gt;&lt;/script&gt;
  
      &lt;script src="js/main.js"&gt;&lt;/script&gt;
  
      &lt;script&gt;
          var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
          (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
          g.src='//www.google-analytics.com/ga.js';
          s.parentNode.insertBefore(g,s)}(document,'script'));
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>from the little knowledge i have on HTML 5 seems like the code should work.
  kindly help me figure out why the Modal will not display in the browser.
  i also added the link as suggested and downloaded Modal.js but the modal still will not show in my browser. Kindly Help.</p>