add demo for DOMtastic

dryabov · dryabov · commit 692ebcf47475 · 2014-06-05T21:34:25.000+04:00
diff --git a/demo/domtastic.htm b/demo/domtastic.htm
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="utf-8">
+    <title>DOMtastic</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="../libs/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="css/style.css">
+    <script src="../libs/domtastic/domtastic.js"></script>
+    <script src="../dist/jquery.lazyloadxt.js"></script>
+</head>
+<body>
+    <div class="container">
+        <div class="page-header">
+            <h1>DOMtastic</h1>
+            <p class="lead">Work with DOMtastic library.</p>
+        </div>
+
+        <script>
+        var category = 'cats', count = 10;
+        for(var i=1; i<=count; i++) {
+            document.write('<p><img data-src="http://lorempixel.com/300/200/'+category+'/'+i+'" width="300" height="200"></p>');
+        }
+        </script>
+    </div>
+</body>
+</html>
diff --git a/demo/index.htm b/demo/index.htm
@@ -31,6 +31,10 @@ <h4 class="list-group-item-heading">Autoload addon</h4>
                 <h4 class="list-group-item-heading">Background images addon</h4>
                 <p class="list-group-item-text">Example of lazy loading of background images</p>
             </a>
+            <a href="domtastic.htm" class="list-group-item">
+                <h4 class="list-group-item-heading">DOMtastic</h4>
+                <p class="list-group-item-text">Work with DOMtastic library</p>
+            </a>
             <a href="fadein.htm" class="list-group-item">
                 <h4 class="list-group-item-heading">Fade-in</h4>
                 <p class="list-group-item-text">Lazy loading with fade-in effect</p>
