Respond. js ----- 20150415, respond. js
Respond. js enables IE6-8 to support CSS3 Media Query.
The js file is introduced in Bootstrap, which is self-adaptive and compatible according to the name. Open IE and check it out. The effect is good, and the adaptive effect is good. Respond. js allows browsers that do not support CSS3 Media Query, including IE6-IE8 and other browsers, to support queries.
Css path to the array.
2. traverse the array and send ajax requests one by one
3. After ajax callback, only the min-width and max-width syntaxes of the media query in response are analyzed, and the corresponding css blocks corresponding to the viewport change interval are analyzed.
4. When the page is initialized and window. resize, the corresponding css block is used according to the current viewport.
Use: Because IE9 supports CSS3, you can directly add a script reference to the head tag of the HTML page:
<!--[
if
lt IE 9]>
<script src=
"http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"
></script>
<![endif]—>
Official demo address: http:
// Scottjehl.github.com/Respond/test/test.html 1. Commonly Used min/max-width media queries in css
@media screen and (min-width: 480px){
...styles
for
480px and up go here
}
@media screen and (min-width: 480px){...styles
for
480px and up go here}
2. introduce respond. min. js, but it needs to be behind css (the earlier the introduction, the better, the lower the probability of page pop-up under ie, because css will be rendered first, if respond. js loads very much later. At this time, the css parsed based on media query will change the page layout again, so there seems to be a pop-up screen)