JavaScript components
(1) each plug-in (with JS function components), want to use the bootstrap plugin, one is to write his HTML, the second is to use CSS to modify it, and then introduce the corresponding JS file. Bootstrap frame in the Carousel diagram, he has his own JS file. JavaScript plug-ins can be introduced individually (using a single *.js file provided by Bootstrap), or all at once (using Bootstrap.js or compressed version of Bootstrap.min.js). It is recommended to use a compressed version of the JavaScript files Bootstrap.js and bootstrap.min.js all include all plug-ins, when you use, just select a page to introduce. (2) The Data property of the component data-toggle: refers to what event triggers Data-target: bind its effect to the object (3) The dependency between the plug-ins import bootstrap.min.js before importing Jquery.js I. Modal box modal.js ----- appears as a pop-up dialog box. Click the button to start a modal box from JavaScript. This modal frame will appear from top to bottom and gradually to the front of the page. <!--button Trigger modal--><button type= "button" class= "btn btn-primary btn-lg" data-toggle= "modal" data-target= "#myModal" > modal buttons </button> <!--Modal--> The fade transition effect is added to the Madal, not on the button! <div class= "Modal Fade" id= "Mymodal" tabindex= "-1" role= "dialog" aria-labelledby= "Mymodallabel" aria-hidden= "True" > <!--determines the size and position of the modal box by adding the Modal-lg class to change the size--> <div class= "Modal-dialog modal-lg ">&Nbsp; <!--modal content section--> <div class= "modal-content" > & lt;! --(1) header--> <div class= "Modal-header" > < Button type= "button" class= "Close" data-dismiss= "modal" ><span aria-hidden= "true" >×</span> <span class= "Sr-only" > Close </span></button> &NBSP;<H4 class= " Modal-title "id=" Mymodallabel "> form submission
Bootscript/javascript Components