Download the X distribution file and unzip it into the folder of your choice. Be sure to select the "Use folder names" option when unzipping. After unzipping you will find a folder named Cross-Browser.com which has several sub-folders. In this root folder you will find a web page, index.html, which serves as the index for the distribution package.
Under the root folder Cross-Browser.com are the following sub-folders.
/css/ Styles for the distribution package.
/images/ Images used by the demos.
/templates/ General-purpose template files.
/x/ Prebuilt library file x.js and the build script build.xml.
/x/docs/ X Library documentation files.
/x/examples/ Examples that demonstrate the use of X.
/x/lib/ This is the actual library. It contains all XML and Javascript source files for the X Library.
/x/tools/ Ant macros and executable, source code and project files for the X Tools.
There are very many .js files in the distribution package. This section summarizes their purposes.
This folder contains a general-purpose, prebuilt library file. In almost every application there will be X functions that you always need. This file contains some of the most commonly used X functions. This file does not constitute the entire X Library itself, which is located in the directory /x/lib/.
The prebuilt library file "x.js" contains the following X functions. Click a link to see that symbol in the X Viewer.
x.js xGetElementById, xGetElementsByTagName, xGetElementsByClassName, xMoveTo, xLeft, xTop, xPageX, xPageY, xScrollLeft, xScrollTop, xHasPoint, xResizeTo, xWidth, xHeight, xClientWidth, xClientHeight, xStyle, xOpacity, xGetComputedStyle, xCamelize, xDef, xStr, xNum, xLibrary. xAddEventListener, xRemoveEventListener, xEvent, xStopPropagation, xPreventDefault, xEachE, xEachN, xOffset.
This folder contains the actual library. It contains .xml and .js files. There is an XML file and a Javascript file for every symbol in the library. So, the X Library is not made up of a few files which each contain many functions and objects. All the functions and objects (symbols) in the X Library are each in individual files. This separation into individual files, along with the dependency information in the XML file, allows you to create a library file which only contains the X symbols your application uses. The X Tools completely automate this task.
Read more about the structure of X. Use the X Viewer to browse the sources and documentation for all X Library symbols.
Start with a copy of one of the template files, or visit one of the demos online and save it as HTML on your computer. For example, make a copy of "html5_template.html" and place it in the x/examples directory. This file has a script element which loads the "x.js" file, and has another script element in which a listener is registered for the load event. If you need a function which is not in "x.js" use the X Viewer to look for it. Add another script element to your HTML file which loads the file from the x/lib directory.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Template</title>
<link rel="stylesheet" type="text/css" href="">
<style>
</style>
<script src="../x.js"></script>
<script>
xAddEventListener(window, 'load',
function() {
}, false
);
</script>
</head>
<body>
</body>
</html>
Also take a look at the X Tutorial.
X Library Viewer - View documentation, source code, revision history and more for all X symbols.
X Quick-Start - Getting started with the X Library.
X Tutorial - Collapsible/expandable sections.
X Structure - Describes how an X symbol is defined by an xml and js file.
X Tools - Summary and revision history for the X build tool chain.
XAG Reference - X Library Aggregator.
XPP Reference - General Purpose Text Preprocessor.
Cross-Browser.com is the home of X - a cross-browser Javascript library, and many demos, applications, articles and documentation.
By your use of X and/or CBE and/or any Javascript from this site you consent to the GNU LGPL - please read it. If you have any questions about the license, read the FAQ and/or come to the forums.
Forum support is available at the X Library Support Forums.
The X core is designed to work with all browsers, Object-detection instead of browser-detection is used exclusively. Currently, I'm testing with the following browsers. X has been tested by others on a wide variety of platforms.
Win7 (Home): IE 9.
WinXP (SP3): Chrome 3.0.195.38, Firefox 3.5.5, IE 7 & 8, Opera 10.60 and Safari 4.0.3.
Linux (Ubuntu 9.10): Chrome 4.0.249.43 and FireFox 3.5.7.