diff --git a/README.md b/README.md
index d452b57..2eaf853 100755
--- a/README.md
+++ b/README.md
@@ -25,92 +25,76 @@ Important: Because of old browsers (e.g. IE6, IE7), we recommend to implement th
```
-3. Paste the required HTML at the end of your document (see demo examples):
+3. Call the plugin by placing the following at the bottom of the HTML body:
- ```html
-
- ```
-
-
-4. Call the plugin by placing the following at the bottom of the HTML body:
-
-— Plain Javascript
- ```javascript
- //event listener: DOM ready
- function addLoadEvent(func) {
- var oldonload = window.onload;
- if (typeof window.onload != 'function') {
- window.onload = func;
- } else {
- window.onload = function() {
- if (oldonload) {
- oldonload();
- }
- func();
- }
- }
- }
- //call plugin function after DOM ready
- addLoadEvent(
- outdatedBrowser(function(){
- bgColor: '#f25648',
- color: '#ffffff',
- lowerThan: 'transform',
- languagePath: 'your_path/outdatedbrowser/lang/en.html'
- })
- });
- ```
-
-— Using jQuery (version that supports IE<9)
- ```javascript
- $( document ).ready(function() {
- outdatedBrowser({
- bgColor: '#f25648',
- color: '#ffffff',
- lowerThan: 'transform',
- languagePath: 'your_path/outdatedbrowser/lang/en.html'
- })
- })
- ```
-
-6. Using the plugin without AJAX calls:
-
- — Paste the required HTML at the end of your document (see demo examples):
+ ##### Without AJAX (static message)
+
+ a. Paste the required HTML at the end of your document (see demo examples):
+
```html
-
Your browser is out-of-date!
-
Update your browser to view this website correctly. Update my browser now
-
×
+
Your browser is out-of-date!
+
+ Update your browser to view this website correctly.
+ Update my browser now
+
+
+ ×
+
```
-
- — Call the plugin (see 4.) but with the variable languagePath empty:
- ```javascript
- //DOM ready or jQuery
+
+ b. Call the plugin with `languagePath` empty:
+
+ ```javascript
+ $( document ).ready(function() {
outdatedBrowser({
bgColor: '#f25648',
color: '#ffffff',
lowerThan: 'transform',
languagePath: ''
- })
- ```
-
+ });
+ });
+ ```
+ _If you're not using jQuery, see the [Plain Javascript section](#plain-javascript).)_
-6. Targeting browsers:
+ ##### With AJAX (multiple languages)
+
+ a. Paste the required HTML at the end of your document (see demo examples):
+
+ ```html
+
+ ```
+
+ b. Call the plugin with `languagePath` set:
+
+ ```javascript
+ $( document ).ready(function() {
+ outdatedBrowser({
+ bgColor: '#f25648',
+ color: '#ffffff',
+ lowerThan: 'transform',
+ languagePath: 'your_path/outdatedbrowser/lang/en.html'
+ });
+ });
+ ```
+
+ _If you're not using jQuery, see the [Plain Javascript section](#plain-javascript).)_
+
+4. Targeting browsers:
You can do it in one of two ways: using Internet Explorer browsers as reference or specifying a CSS property. The outcome is the same, choose what is easier for you.
-
Lower Than (<):
* "IE11","borderImage"
* "IE10", "transform" (Default property)
* "IE9", "boxShadow"
* "IE8", "borderSpacing"
-7. Choose the language:
-
- Download the “lang" folder: If you have the language you want, just write the correct path for the language file in your project; If you don’t have your language, you can write your own html file, and please share it with us.
+5. Choose the language (only applicable for AJAX)
+
+ Download the “lang" folder: If you have the language you want, just write the correct path for the language file in your project; If you don’t have your language, you can write your own html file, and please share it with us.
And you're done!
PS: check the "demo" folder, it may help you.
@@ -133,6 +117,36 @@ The basic structure of the project is given in the following way:
│ └── outdatedBrowser.css-->
+## Plain Javascript
+
+If you're not using jQuery, you can modify the usage instructions by creating your own DOM ready, as shown here:
+
+```javascript
+//event listener: DOM ready
+function addLoadEvent(func) {
+ var oldonload = window.onload;
+ if (typeof window.onload != 'function') {
+ window.onload = func;
+ } else {
+ window.onload = function() {
+ if (oldonload) {
+ oldonload();
+ }
+ func();
+ }
+ }
+}
+//call plugin function after DOM ready
+addLoadEvent(
+ outdatedBrowser(function(){
+ bgColor: '#f25648',
+ color: '#ffffff',
+ lowerThan: 'transform',
+ languagePath: 'your_path/outdatedbrowser/lang/en.html'
+ })
+});
+```
+
## FAQ
Before opening a new issue please check our [FAQ page](https://github.com/burocratik/outdated-browser/wiki/FAQ)