Head.js Web sites to load in parallel but sequentially to execute JS

http://headjs.com/

Parallel loading JS, but executed in order to improve the speed of the site

<script src= "Js/head.min.js" ></script>

<script type= "Text/javascript" > Head.js ("Js/jquery-1.6.1.min.js", "Js/jquery.validate.min.js", "Js/my_ Validate.js "); </script>

Note: head.js ("Js/jquery-1.6.1.min.js", "Js/jquery.validate.min.js", "js/my_validate.js"); JS contained inside the local folder must have, otherwise in the middle of IE execution

such as: Head.js ("Js/jquery-1.6.1.min.js", "Js/jquery.validate.min.js", "js/alert.js"); If there is no Jquery.validate.min.js file locally, the alert.js will not be executed under IE

1, asynchronous loading other JS files, such as Jquery. Although I also put the quoted external JS at the bottom of the page, but after using the head.js, I can put all the JS content into a file, placed in the end of the page. Then you can refer to the other external JS in this JS file. For example, the bottom of my page refers to a JS content:

head(function() {........});/* part 1 */head.js("http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js");/* part 2 */

The first part of the page loaded after the completion of the JS script to execute, the second part of the script before executing the external JS file address, it is obvious that if you want to upgrade the use of the Jquery version, I just need to modify the file on the line without changing the content of the page. This is useful for movabletype that use static publishing.

2, CSS3 attribute support degree detection. It's very awkward to say, meaning that you can tell whether a browser supports a CSS3 attribute. If a property is supported, a class named with this attribute will be added to the HTML node of the page, and if not supported, the class name will have a no-prefix. For example, IE6 does not support the Boxshadow property, so the HTML node of the page is similar when browsing this page with IE6 access:   .

This allows you to set the CSS file to use other alternatives when the browser does not support an advanced attribute.

.boxshadow .box{box-shadow: 0px 0px 5px #bbb;}.no-boxshadow .box{border: 2px solid #bbb;}

Currently head.js can detect the CSS3 attribute there borderimage borderradius boxshadow opacity reflections rgba textshadow transforms transitions .

3, Head.js can detect the type of browser, version, you can also detect the current page relative to the site root directory path, the more cool, head.js can dynamically detect the browser's current window size. And, the previous properties are passed dynamically to the HTML node, add the corresponding Class! With CSS, you can create a cool design that adapts to each browser, each page is unique, and changes automatically as the window resizes.

Head.js Web sites to load in parallel but sequentially to execute JS