en en en es es tr en es fi id en en en en en en en en en en fr en en en en en en en hbs_lat en fr en en en en en en en en en fr en en en en en en fr en en en en fr en en en en en fr sv de en en fr en en en en en fr en en en en fr hbs_lat en en en fr en en fr hbs_lat en en en en en en en en en fr en en en en hbs_lat en en en fr en en en en hbs_lat en en en en en la en en en en en la la la la la la la la en en la kn en en en hbs_lat en en en hbs_lat en en en en hbs_lat en en it en kn en fa en kn en en en fa en en en fa en en en fa en en en da en en en ja en en en en es en en ca en es en en en en en en en en en en en en en en uk fr en en fr en en en en fr en en en en fr en en en en en en en en fr en en en en fr en en en en fr en en en en en en en en it en en en en en en en en en en en en en en en en en en en en en en en en es en en en es fr en en en en en es en en en en en en en en en en en en en it en en hbs_lat en en ar en en en en en es en ar kn en fa en kn en en en en en en en en es en en en en es en uk en en en la en en en en en en ko en en en en en en
Dropdown          Action     Another action     Something else here        Separated link
Dropdown header  ...     Dropdown header  ...
Regular link     Disabled link     Another link
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
This button should trigger a popover on click.
This link and that link should have tooltips on hover.
Overflowing text to show scroll behavior
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.
Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
Launch demo modal             ×  Close    Modal title       Text in a modal   Duis mollis, est non commodo luctus, nisi erat porttitor ligula.   Popover in a modal   This  button  should trigger a popover on click.   Tooltips in a modal    This link  and  that link  should have tooltips on hover.     Overflowing text to show scroll behavior   Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.   Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.   Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.   Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.   Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.   Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.   Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.   Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.       Close   Save changes
Large modal            ×  Close    Large modal      ...              Small modal            ×  Close    Small modal      ...
For modals that simply appear rather than fade in to view, remove the .fade class from your modal markup.
The modal plugin toggles your hidden content on demand, via data attributes or JavaScript. It also adds .modal-open to the   to override default scrolling behavior and generates a .modal-backdrop to provide a click area for dismissing shown modals when clicking outside the modal.
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-backdrop="".
boolean or the string 'static'
Includes a modal-backdrop element. Alternatively, specify static for a backdrop which doesn't close the modal on click.
Closes the modal when escape key is pressed
Shows the modal when initialized.
If a remote URL is provided, content will be loaded one time via jQuery's load method and injected into the .modal-content div. If you're using the data-api, you may alternatively use the href attribute to specify the remote source. An example of this is shown below:
$('#myModal').modal({ keyboard: false })
Manually toggles a modal. Returns to the caller before the modal has actually been shown or hidden (i.e. before the shown.bs.modal or hidden.bs.modal event occurs).
Manually opens a modal. Returns to the caller before the modal has actually been shown (i.e. before the shown.bs.modal event occurs).
Manually hides a modal. Returns to the caller before the modal has actually been hidden (i.e. before the hidden.bs.modal event occurs).
Bootstrap's modal class exposes a few events for hooking into modal functionality.
This event fires immediately when the show instance method is called. If caused by a click, the clicked element is available as the relatedTarget property of the event.
This event is fired when the modal has been made visible to the user (will wait for CSS transitions to complete). If caused by a click, the clicked element is available as the relatedTarget property of the event.
This event is fired immediately when the hide instance method has been called.
This event is fired when the modal has finished being hidden from the user (will wait for CSS transitions to complete).
This event is fired when the modal has loaded content using the remote option.
$('#myModal').on('hidden.bs.modal', function (e) { // do something... })
Toggle navigation Project Name
Toggle navigation              Project Name           Dropdown         Action     Another action     Something else here        Separated link          Dropdown 2         Action     Another action     Something else here        Separated link              Dropdown 3         Action     Another action     Something else here        Separated link
Regular link      Dropdown         Action     Another action     Something else here        Separated link          Dropdown 2         Action     Another action     Something else here        Separated link          Dropdown 3         Action     Another action     Something else here        Separated link
Via data attributes or JavaScript, the dropdown plugin toggles hidden content (dropdown menus) by toggling the .open class on the parent list item. When opened, the plugin also adds .dropdown-backdrop as a click area for closing dropdown menus when clicking outside the menu. Note: The data-toggle=dropdown attribute is relied on for closing dropdown menus at an application level, so it's a good idea to always use it.
Add data-toggle="dropdown" to a link or button to toggle a dropdown.
Call the dropdowns via JavaScript:
Regardless of whether you call your dropdown via JavaScript or instead use the data-api, data-toggle="dropdown" is always required to be present on the dropdown's trigger element.
Toggles the dropdown menu of a given navbar or tabbed navigation.
All dropdown events are fired at the .dropdown-menu's parent element.
This event fires immediately when the show instance method is called. The toggling anchor element is available as the relatedTarget property of the event.
This event is fired when the dropdown has been made visible to the user (will wait for CSS transitions, to complete). The toggling anchor element is available as the relatedTarget property of the event.
This event is fired immediately when the hide instance method has been called. The toggling anchor element is available as the relatedTarget property of the event.
This event is fired when the dropdown has finished being hidden from the user (will wait for CSS transitions, to complete). The toggling anchor element is available as the relatedTarget property of the event.
$('#myDropdown').on('show.bs.dropdown', function () { // do something... })
The ScrollSpy plugin is for automatically updating nav targets based on scroll position. Scroll the area below the navbar and watch the active class change. The dropdown sub items will be highlighted as well.
Toggle navigation Project Name
Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.
Veniam marfa mustache skateboard, adipisicing fugiat velit pitchfork beard. Freegan beard aliqua cupidatat mcsweeney's vero. Cupidatat four loko nisi, ea helvetica nulla carles. Tattooed cosby sweater food truck, mcsweeney's quis non freegan vinyl. Lo-fi wes anderson +1 sartorial. Carles non aesthetic exercitation quis gentrify. Brooklyn adipisicing craft beer vice keytar deserunt.
Occaecat commodo aliqua delectus. Fap craft beer deserunt skateboard ea. Lomo bicycle rights adipisicing banh mi, velit ea sunt next level locavore single-origin coffee in magna veniam. High life id vinyl, echo park consequat quis aliquip banh mi pitchfork. Vero VHS est adipisicing. Consectetur nisi DIY minim messenger bag. Cred ex in, sustainable delectus consectetur fanny pack iphone.
In incididunt echo park, officia deserunt mcsweeney's proident master cleanse thundercats sapiente veniam. Excepteur VHS elit, proident shoreditch +1 biodiesel laborum craft beer. Single-origin coffee wayfarers irure four loko, cupidatat terry richardson master cleanse. Assumenda you probably haven't heard of them art party fanny pack, tattooed nulla cardigan tempor ad. Proident wolf nesciunt sartorial keffiyeh eu banh mi sustainable. Elit wolf voluptate, lo-fi ea portland before they sold out four loko. Locavore enim nostrud mlkshk brooklyn nesciunt.
Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.
Keytar twee blog, culpa messenger bag marfa whatever delectus food truck. Sapiente synth id assumenda. Locavore sed helvetica cliche irony, thundercats you probably haven't heard of them consequat hoodie gluten-free lo-fi fap aliquip. Labore elit placeat before they sold out, terry richardson proident brunch nesciunt quis cosby sweater pariatur keffiyeh ut helvetica artisan. Cardigan craft beer seitan readymade velit. VHS chambray laboris tempor veniam. Anim mollit minim commodo ullamco thundercats.
Toggle navigation              Project Name          @fat     @mdo      Dropdown         one     two        three                  @fat   Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.   @mdo   Veniam marfa mustache skateboard, adipisicing fugiat velit pitchfork beard. Freegan beard aliqua cupidatat mcsweeney's vero. Cupidatat four loko nisi, ea helvetica nulla carles. Tattooed cosby sweater food truck, mcsweeney's quis non freegan vinyl. Lo-fi wes anderson +1 sartorial. Carles non aesthetic exercitation quis gentrify. Brooklyn adipisicing craft beer vice keytar deserunt.   one   Occaecat commodo aliqua delectus. Fap craft beer deserunt skateboard ea. Lomo bicycle rights adipisicing banh mi, velit ea sunt next level locavore single-origin coffee in magna veniam. High life id vinyl, echo park consequat quis aliquip banh mi pitchfork. Vero VHS est adipisicing. Consectetur nisi DIY minim messenger bag. Cred ex in, sustainable delectus consectetur fanny pack iphone.   two   In incididunt echo park, officia deserunt mcsweeney's proident master cleanse thundercats sapiente veniam. Excepteur VHS elit, proident shoreditch +1 biodiesel laborum craft beer. Single-origin coffee wayfarers irure four loko, cupidatat terry richardson master cleanse. Assumenda you probably haven't heard of them art party fanny pack, tattooed nulla cardigan tempor ad. Proident wolf nesciunt sartorial keffiyeh eu banh mi sustainable. Elit wolf voluptate, lo-fi ea portland before they sold out four loko. Locavore enim nostrud mlkshk brooklyn nesciunt.   three   Ad leggings keytar, brunch id art party dolor labore. Pitchfork yr enim lo-fi before they sold out qui. Tumblr farm-to-table bicycle rights whatever. Anim keffiyeh carles cardigan. Velit seitan mcsweeney's photo booth 3 wolf moon irure. Cosby sweater lomo jean shorts, williamsburg hoodie minim qui you probably haven't heard of them et cardigan trust fund culpa biodiesel wes anderson aesthetic. Nihil tattooed accusamus, cred irony biodiesel keffiyeh artisan ullamco consequat.   Keytar twee blog, culpa messenger bag marfa whatever delectus food truck. Sapiente synth id assumenda. Locavore sed helvetica cliche irony, thundercats you probably haven't heard of them consequat hoodie gluten-free lo-fi fap aliquip. Labore elit placeat before they sold out, terry richardson proident brunch nesciunt quis cosby sweater pariatur keffiyeh ut helvetica artisan. Cardigan craft beer seitan readymade velit. VHS chambray laboris tempor veniam. Anim mollit minim commodo ullamco thundercats.
No matter the implementation method, scrollspy requires the use of position: relative; on the element you're spying on. In most cases this is the  .
To easily add scrollspy behavior to your topbar navigation, add data-spy="scroll" to the element you want to spy on (most typically this would be the  ). Then add the data-target attribute with the ID or class of the parent element of any Bootstrap .nav component.
body { position: relative; }
After adding position: relative; in your CSS, call the scrollspy via JavaScript:
$('body').scrollspy({ target: '.navbar-example' })
Resolvable ID targets required
Navbar links must have resolvable id targets. For example, a  home  must correspond to something in the DOM like   .
Non-:visible target elements ignored
Target elements that are not :visible according to jQuery will be ignored and their corresponding nav items will never be highlighted.
When using scrollspy in conjunction with adding or removing of elements from the DOM, you'll need to call the refresh method like so:
$('[data-spy="scroll"]').each(function () { var $spy = $(this).scrollspy('refresh') })
Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-offset="".
Pixels to offset from top when calculating position of scroll.
This event fires whenever a new item becomes activated by the scrollspy.
This event fires whenever a new item becomes activated by the scrollspy.
$('#myScrollspy').on('activate.bs.scrollspy', function () { // do something… })
"It's minimal not just sleek!
"Mission accomplished. It's classic!"
Libero donec, quam in etiam nulla enim eu, pharetra nulla.
Check out our carefully selected products and let us exceed your expectations.
Feel free to contact us and find out more about pur products.
It will satisfy all your needs regarding your health. Start at the very beginning or simply use our products. With a few clicks you can lift your health to a completely higher level and feel the power of the products.
Copyright 2016 by Al-Karma International Company. Terms Of Use Privacy Statement