Ajax Loader
HTML
<dl>
1
<dl>
2
    <!-- Name -->
3
    <dt>Browser Name</dt>
4
    <dd id='name'></dd>
5
    <!-- Version --> 
6
    <dt>Browser Version</dt>
7
    <dd id='version'></dd>
8
    <!-- Platform -->
9
    <dt>Operating System</dt>
10
    <dd id='os'></dd>
11
</dl>
 
CSS
html, body { 
1
html, body { 
2
  font-family:Lucida Sans Unicode; 
3
  font-size:90%; 
4
  margin:5px 
5
}
6
 
7
dd { margin:0 0 10px 0; color:#898989; font-size:90% } 
 
JavaScript
var BrowserDetect = {
1
var BrowserDetect = {
2
    init: function () {
3
        this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
4
        this.version = this.searchVersion(navigator.userAgent) || this.searchVersion(navigator.appVersion) || "an unknown version";
5
        this.OS = this.searchString(this.dataOS) || "an unknown OS";
6
    },
7
    searchString: function (data) {
8
        for (var i=0;i<data.length;i++)    {
9
            var dataString = data[i].string;
10
            var dataProp = data[i].prop;
11
            this.versionSearchString = data[i].versionSearch || data[i].identity;
12
            if (dataString) {
13
                if (dataString.indexOf(data[i].subString) != -1)
14
                    return data[i].identity;
15
            }
16
            else if (dataProp)
17
                return data[i].identity;
18
        }
19
    },
20
    searchVersion: function (dataString) {
21
        var index = dataString.indexOf(this.versionSearchString);
22
        if (index == -1) return;
23
        return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
24
    },
25
    dataBrowser: [
26
        {
27
            string: navigator.userAgent,
28
            subString: "Chrome",
29
            identity: "Chrome"
30
        },
31
        {     string: navigator.userAgent,
32
            subString: "OmniWeb",
33
            versionSearch: "OmniWeb/",
34
            identity: "OmniWeb"
35
        },
36
        {
37
            string: navigator.vendor,
38
            subString: "Apple",
39
            identity: "Safari",
40
            versionSearch: "Version"
41
        },
42
        {
43
            prop: window.opera,
44
            identity: "Opera",
45
            versionSearch: "Version"
46
        },
47
        {
48
            string: navigator.vendor,
49
            subString: "iCab",
50
            identity: "iCab"
51
        },
52
        {
53
            string: navigator.vendor,
54
            subString: "KDE",
55
            identity: "Konqueror"
56
        },
57
        {
58
            string: navigator.userAgent,
59
            subString: "Firefox",
60
            identity: "Firefox"
61
        },
62
        {
63
            string: navigator.vendor,
64
            subString: "Camino",
65
            identity: "Camino"
66
        },
67
        {        
68
            /* For Newer Netscapes (6+) */
69
            string: navigator.userAgent,
70
            subString: "Netscape",
71
            identity: "Netscape"
72
        },
73
        {
74
            string: navigator.userAgent,
75
            subString: "MSIE",
76
            identity: "Internet Explorer",
77
            versionSearch: "MSIE"
78
        },
79
        {
80
            string: navigator.userAgent,
81
            subString: "Gecko",
82
            identity: "Mozilla",
83
            versionSearch: "rv"
84
        },
85
        {   
86
            /* For Older Netscapes (4-) */
87
            string: navigator.userAgent,
88
            subString: "Mozilla",
89
            identity: "Netscape",
90
            versionSearch: "Mozilla"
91
        }
92
    ],
93
    dataOS : [
94
        {
95
            string: navigator.platform,
96
            subString: "Win",
97
            identity: "Windows"
98
        },
99
        {
100
            string: navigator.platform,
101
            subString: "Mac",
102
            identity: "Mac"
103
        },
104
        {
105
            string: navigator.userAgent,
106
            subString: "iPhone",
107
            identity: "iPhone/iPod"
108
        },
109
        {
110
            string: navigator.platform,
111
            subString: "Linux",
112
            identity: "Linux"
113
        }
114
    ]
115
 
116
};
117
BrowserDetect.init();
118
 
119
document.getElementById("name").innerHTML=BrowserDetect.browser;
120
document.getElementById("version").innerHTML=BrowserDetect.version;
121
document.getElementById("os").innerHTML=BrowserDetect.OS
 

Browser Detection

CSSDeck G+