Category Archives: bootstrap

Boostrap Navbar Example

  1. Include jQuery
    <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js”></script>
  2. Include boostrap
    http://getbootstrap.com/getting-started/#download

HTML Example:

Keep navbar as collapsed for all screen sizes.

Reference:
http://stackoverflow.com/questions/22462142/how-to-keep-bootstrap-3-navbar-as-collapsed-for-all-screen-sizes

Customization:

 

Popover Handling

This example will trigger a popover when a link is clicked and dismiss automatically in 3 seconds. 

 

viewport – page width in mobile devices

Basic:

Advance:

If you want pages are resized automatically basing on browser width and without (or few) RWD scripts, “viewport” is a good solution for this. The key is how to use attribute “maximum-scale”:

 Reference:

  1. https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag

Related CSS:

References:

HTML5 Template

Bootstrap: http://getbootstrap.com

 

layout.css

 

Table Example

 

Click Issue of popover

 

Note:

  1. trigger: manual and event.stopPropagation() are the keys
  2. http://twitter.github.io/bootstrap/javascript.html#popovers
  3. http://stackoverflow.com/questions/8947749/how-can-i-close-a-twitter-bootstrap-popover-with-a-click-from-anywhere-else-on