* Added data-lazyload attribute to load content.

* Added script type="text/lazyload" to load content. * Supported text content.
emn178 · Feb 17, 2016 · 805063c · 805063c
1 parent ab7dc51
commit 805063c
Show file tree

Hide file tree

Showing 10 changed files with 170 additions and 114 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,9 @@
+# v0.3.0 / 2016-02-17
+
+* Added data-lazyload attribute to load content.
+* Added script type="text/lazyload" to load content.
+* Supported text content.
+
 # v0.2.3 / 2014-10-21
 
 * Add refresh method for element move.

diff --git a/LICENSE.txt b/LICENSE.txt
@@ -1,4 +1,6 @@
-Copyright 2014-2015 emn178@gmail.com
+Copyright (c) 2014-2016 Yi-Cyuan Chen
+
+MIT License
 
 Permission is hereby granted, free of charge, to any person obtaining
 a copy of this software and associated documentation files (the

diff --git a/README.md b/README.md
@@ -1,30 +1,48 @@
 # jQuery-lazyload-any
 A jQuery plugin provides a lazyload function for images, iframe or anything.
 
-## Download
-[Compress](https://raw.github.com/emn178/jquery-lazyload-any/master/build/jquery.lazyload-any.min.js)  
-[Uncompress](https://raw.github.com/emn178/jquery-lazyload-any/master/src/jquery.lazyload-any.js)
-
 ## Demo
 [Images](http://emn178.github.io/jquery-lazyload-any/samples/images/) ([Overflow and Tabs](http://emn178.github.io/jquery-lazyload-any/samples/overflow/))  
 [Youtube](http://emn178.github.io/jquery-lazyload-any/samples/youtube/)
 
-## Browser Support
-jQuery-lazyload-any currently supports IE7+, Chrome, Firefox, Safari and Opera.
+## Download
+[Compress](https://raw.github.com/emn178/jquery-lazyload-any/master/build/jquery.lazyload-any.min.js)  
+[Uncompress](https://raw.github.com/emn178/jquery-lazyload-any/master/src/jquery.lazyload-any.js)
+
+## Installation
+You can install jquery-lazyload-any by using Bower.
+```
+bower install jquery-lazyload-any
+```
 
 ## Usage
-HTML
+HTML  
+*Attribute Style*
+```HTML
+<div id="you-want-lazyload" data-lazyload="&lt;p&gt;Anything you want to lazyload&lt;/p&gt;">
+</div>
+```
+*Script Style*
+```HTML
+<div id="you-want-lazyload">
+  <script type="text/lazyload">
+    <p>Anything you want to lazyload</p>
+  </script>
+</div>
+```
+*Comment Style*
 ```HTML
 <div id="you-want-lazyload">
   <!--
-    Anything you want to lazyload
+    <p>Anything you want to lazyload</p>
   -->
 </div>
 ```
 JavaScript
 ```JavaScript
 $('#you-want-lazyload').lazyload(options);
 ```
+You should choose only one style. When multiple styles set, priority is Attribute > Script > Comment.
 
 ### Options
 #### *threshold: `Number` (default: `0`)*
@@ -93,15 +111,9 @@ $('.lazyload').lazyload({
 });
 ```
 
-## Installation
-You can install jquery-lazyload-any by using Bower.
-```
-bower install jquery-lazyload-any
-```
-
 ## License
 The project is released under the [MIT license](http://www.opensource.org/licenses/MIT).
 
 ## Contact
 The project's website is located at https://github.com/emn178/jquery-lazyload-any  
-Author: emn178@gmail.com
+Author: Yi-Cyuan Chen (emn178@gmail.com)
diff --git a/bower.json b/bower.json
@@ -1,7 +1,7 @@
 {
 	"name": "jquery-lazyload-any",
-	"version": "0.2.3",
-	"main": ["build/jquery.lazyload-any.min.js"],
+	"version": "0.3.0",
+	"main": ["src/jquery.lazyload-any.js"],
 	"ignore": [
 		"samples",
 		"tests"

diff --git a/build/jquery.lazyload-any.min.js b/build/jquery.lazyload-any.min.js
diff --git a/samples/images/index.html b/samples/images/index.html
@@ -3,19 +3,20 @@
 <head>
   <meta charset="UTF-8">
   <title>Lazyload Images</title>
-  <link href='http://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
+  <link href='https://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="style.css">
-  <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
+  <script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>
   <script type="text/javascript" src="../../src/jquery.lazyload-any.js"></script>
   <script>
-    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
-    ga('create', 'UA-44208259-3', 'auto');
-    ga('send', 'pageview');
+    if(location.protocol != 'file:') {
+      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
+      ga('create', 'UA-44208259-3', 'auto');
+      ga('send', 'pageview');
+    }
   </script>
 </head>
 <body>
@@ -177,11 +178,11 @@ <h2 class="section-title">Aquaman</h2>
     }
     $('.lazyload').lazyload({load: load});
   </script>
-  <link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet">
-  <link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet">
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js"></script>
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js"></script>
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js"></script>
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shCore.css" rel="stylesheet">
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shThemeDefault.css" rel="stylesheet">
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shCore.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJScript.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushXml.js"></script>
   <script>
     SyntaxHighlighter.all();
   </script>

diff --git a/samples/overflow/index.html b/samples/overflow/index.html
@@ -3,21 +3,22 @@
 <head>
   <meta charset="UTF-8">
   <title>Overflow and Tabs</title>
-  <link href='http://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
+  <link href='https://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css">
   <link rel="stylesheet" href="style.css">
-  <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
-  <script src="http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
+  <script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>
+  <script src="https://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
   <script type="text/javascript" src="../../src/jquery.lazyload-any.js"></script>
   <script>
-    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
-    ga('create', 'UA-44208259-3', 'auto');
-    ga('send', 'pageview');
+    if(location.protocol != 'file:') {
+      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
+      ga('create', 'UA-44208259-3', 'auto');
+      ga('send', 'pageview');
+    }
   </script>
 </head>
 <body>
@@ -188,11 +189,11 @@ <h2 class="section-title">Aquaman</h2>
     $( "#tabs" ).tabs();
     $('.lazyload').lazyload({load: load});
   </script>
-  <link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet">
-  <link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet">
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js"></script>
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js"></script>
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js"></script>
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shCore.css" rel="stylesheet">
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shThemeDefault.css" rel="stylesheet">
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shCore.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJScript.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushXml.js"></script>
   <script>
     SyntaxHighlighter.all();
   </script>

diff --git a/samples/youtube/index.html b/samples/youtube/index.html
@@ -3,19 +3,20 @@
 <head>
   <meta charset="UTF-8">
   <title>Lazyload Youtube</title>
-  <link href='http://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
+  <link href='https://fonts.googleapis.com/css?family=Roboto+Slab' rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="style.css">
-  <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
+  <script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
   <script type="text/javascript" src="../../src/jquery.lazyload-any.js"></script>
   <script>
-    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
-
-    ga('create', 'UA-44208259-3', 'auto');
-    ga('send', 'pageview');
+    if(location.protocol != 'file:') {
+      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
+      ga('create', 'UA-44208259-3', 'auto');
+      ga('send', 'pageview');
+    }
   </script>
 </head>
 <body>
@@ -243,11 +244,11 @@ <h2 class="section-title">Aquaman</h2>
     $('.lazyload-thumbnail').lazyload({load: load});
     $('.lazyload-youtube').lazyload({trigger: 'click'});
   </script>
-  <link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet">
-  <link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css" rel="stylesheet">
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js"></script>
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js"></script>
-  <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js"></script>
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shCore.css" rel="stylesheet">
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/styles/shThemeDefault.css" rel="stylesheet">
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shCore.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushJScript.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/SyntaxHighlighter/3.0.83/scripts/shBrushXml.js"></script>
   <script>
     SyntaxHighlighter.all();
   </script>