From 1898bfa9f09a3276b7126e6ef672aa9fc241da92 Mon Sep 17 00:00:00 2001
From: Mika Tuupola <tuupola@appelsiini.net>
Date: Sat, 15 Mar 2008 13:19:04 +0000
Subject: [PATCH] Show source in example pages.

---
 enabled.html           |  7 +++++++
 enabled_fadein.html    | 15 ++++++++++++---
 enabled_gazillion.html | 13 +++++++++++--
 enabled_timeout.html   |  2 +-
 enabled_wide.html      |  7 +++++++
 5 files changed, 38 insertions(+), 6 deletions(-)

diff --git a/enabled.html b/enabled.html
index 89fe28f8..a80430de 100644
--- a/enabled.html
+++ b/enabled.html
@@ -60,6 +60,13 @@ <h2>Plugin enabled</h2>
       <a href="disabled.html">disabled</a>.
     </p>
 
+    <code>
+      <pre>
+ $("img").lazyload({         
+     placeholder : "img/grey.gif"
+ });</pre>   
+    </code>
+
     <img src="img/bmw_m1_hood.jpg?<?php print time() ?>" width="765" height="574" alt="BMW M1 Hood"><br/>
     <img src="img/bmw_m1_side.jpg?<?php print time() ?>" width="765" height="574" alt="BMW M1 Side"><br/>
     <img src="img/viper_1.jpg?<?php print time() ?>" width="765" height="574" alt="Viper 1"><br/>
diff --git a/enabled_fadein.html b/enabled_fadein.html
index 73ad236c..dae11a0c 100644
--- a/enabled_fadein.html
+++ b/enabled_fadein.html
@@ -54,15 +54,24 @@ <h1>Lazy Load</h1><br />
     </div>
     <div id="content">
       
-  <h2>Plugin enabled</h2>
+  <h2>Plugin enabled with fadein effect</h2>
   <div class="entry">
     
     <p>
       Images below the fold (the ones lower than window bottom) are not loaded. When scrolling down
-      they are loaded when needed. Shift-reload to test again. Compare this to page where plugin is 
-      <a href="disabled.html">disabled</a>.
+      they are loaded when needed. Images appear using <a href="http://docs.jquery.com/Effects/fadeIn">fadeIn</a>
+      effect. Shift-reload to test again. Compare this to page where plugin is 
+      <a href="enabled.html">without effects</a>.
     </p>
 
+    <code>
+      <pre>
+ $("img").lazyload({
+     placeholder : "img/grey.gif",       
+     effect      : "fadeIn"
+ });</pre>
+    </code>
+
     <img src="img/bmw_m1_hood.jpg?<?php print time() ?>" width="765" height="574" alt="BMW M1 Hood"><br/>
     <img src="img/bmw_m1_side.jpg?<?php print time() ?>" width="765" height="574" alt="BMW M1 Side"><br/>
     <img src="img/viper_1.jpg?<?php print time() ?>" width="765" height="574" alt="Viper 1"><br/>
diff --git a/enabled_gazillion.html b/enabled_gazillion.html
index 279f38b0..944265a6 100644
--- a/enabled_gazillion.html
+++ b/enabled_gazillion.html
@@ -13,12 +13,14 @@
     _uacct = "UA-190966-1";
     urchinTracker();
   </script>
-  <script src="http://static.taevas.ee/js/jquery-1.2.2.mini.js" type="text/javascript" charset="utf-8"></script>
+  <script src="http://static.taevas.ee/js/jquery-1.2.2.js" type="text/javascript" charset="utf-8"></script>
   <script src="http://static.taevas.ee/js/jquery.dimensions-1.2.0.mini.js" type="text/javascript" charset="utf-8"></script>
   <script src="jquery.lazyload.js" type="text/javascript" charset="utf-8"></script>
   <script type="text/javascript" charset="utf-8">
       $(function() {          
-          $("img").lazyload({placeholder : "img/grey.gif"});
+          $("img").lazyload({
+              placeholder : "img/grey.gif"
+          });
       });
   </script>  
   <style type="text/css">
@@ -60,6 +62,13 @@ <h2>Plugin enabled with gazillion images</h2>
       <a href="disabled.html">disabled</a> or page with <a href="enabled.html">larger images</a>.
     </p>
 
+    <code>
+      <pre>
+ $("img").lazyload({
+     placeholder : "img/grey.gif" 
+ });</pre>     
+    </code>
+
     <img src="img/thumbnails/6bfb1786.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1786"><img src="img/thumbnails/6bfb1791.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1791"><img src="img/thumbnails/6bfb1793.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1793"><img src="img/thumbnails/6bfb1800.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1800"><img src="img/thumbnails/6bfb1801.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1801"><img src="img/thumbnails/6bfb1810.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1810"><img src="img/thumbnails/6bfb1813.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1813"><img src="img/thumbnails/6bfb1816.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1816"><img src="img/thumbnails/6bfb1820.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1820"><img src="img/thumbnails/6bfb1825.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1825"><img src="img/thumbnails/6bfb1826.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1826"><img src="img/thumbnails/6bfb1830.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1830"><img src="img/thumbnails/6bfb1831.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1831"><img src="img/thumbnails/6bfb1832.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1832"><img src="img/thumbnails/6bfb1833.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1833"><img src="img/thumbnails/6bfb1834.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1834"><img src="img/thumbnails/6bfb1835.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1835"><img src="img/thumbnails/6bfb1836.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1836"><img src="img/thumbnails/6bfb1837.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1837"><img src="img/thumbnails/6bfb1838.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1838"><img src="img/thumbnails/6bfb1839.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1839"><img src="img/thumbnails/6bfb1840.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1840"><img src="img/thumbnails/6bfb1841.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1841"><img src="img/thumbnails/6bfb1842.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1842"><img src="img/thumbnails/6bfb1843.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1843"><img src="img/thumbnails/6bfb1844.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1844"><img src="img/thumbnails/6bfb1845.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1845"><img src="img/thumbnails/6bfb1846.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1846"><img src="img/thumbnails/6bfb1847.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1847"><img src="img/thumbnails/6bfb1848.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1848"><img src="img/thumbnails/6bfb1849.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1849"><img src="img/thumbnails/6bfb1856.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1856"><img src="img/thumbnails/6bfb1857.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1857"><img src="img/thumbnails/6bfb1858.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1858">
     <img src="img/thumbnails/6bfb1860.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1860"><img src="img/thumbnails/6bfb1864.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1864"><img src="img/thumbnails/6bfb1869.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1869"><img src="img/thumbnails/6bfb1870.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1870"><img src="img/thumbnails/6bfb1871.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1871"><img src="img/thumbnails/6bfb1872.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1872"><img src="img/thumbnails/6bfb1873.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1873"><img src="img/thumbnails/6bfb1877.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1877"><img src="img/thumbnails/6bfb1878.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1878"><img src="img/thumbnails/6bfb1879.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1879"><img src="img/thumbnails/6bfb1880.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1880"><img src="img/thumbnails/6bfb1881.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1881"><img src="img/thumbnails/6bfb1884.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1884"><img src="img/thumbnails/6bfb1885.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1885"><img src="img/thumbnails/6bfb1888.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1888"><img src="img/thumbnails/6bfb1890.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1890"><img src="img/thumbnails/6bfb1893.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1893"><img src="img/thumbnails/6bfb1895.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1895"><img src="img/thumbnails/6bfb1897.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1897"><img src="img/thumbnails/6bfb1899.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1899"><img src="img/thumbnails/6bfb1900.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1900"><img src="img/thumbnails/6bfb1901.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1901"><img src="img/thumbnails/6bfb1903.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1903"><img src="img/thumbnails/6bfb1908.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1908"><img src="img/thumbnails/6bfb1910.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1910"><img src="img/thumbnails/6bfb1912.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1912"><img src="img/thumbnails/6bfb1913.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1913"><img src="img/thumbnails/6bfb1914.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1914"><img src="img/thumbnails/6bfb1916.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1916"><img src="img/thumbnails/6bfb1917.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1917"><img src="img/thumbnails/6bfb1918.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1918"><img src="img/thumbnails/6bfb1919.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1919"><img src="img/thumbnails/6bfb1922.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1922"><img src="img/thumbnails/6bfb1923.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1923"><img src="img/thumbnails/6bfb1924.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1924"><img src="img/thumbnails/6bfb1925.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1925"><img src="img/thumbnails/6bfb1926.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1926"><img src="img/thumbnails/6bfb1927.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1927"><img src="img/thumbnails/6bfb1936.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1936"><img src="img/thumbnails/6bfb1937.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1937"><img src="img/thumbnails/6bfb1940.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1940"><img src="img/thumbnails/6bfb1941.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1941"><img src="img/thumbnails/6bfb1942.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1942">
     <img src="img/thumbnails/6bfb1943.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1943"><img src="img/thumbnails/6bfb1945.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1945"><img src="img/thumbnails/6bfb1946.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1946"><img src="img/thumbnails/6bfb1947.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1947"><img src="img/thumbnails/6bfb1948.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1948"><img src="img/thumbnails/6bfb1949.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1949"><img src="img/thumbnails/6bfb1950.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1950"><img src="img/thumbnails/6bfb1951.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1951"><img src="img/thumbnails/6bfb1952.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1952"><img src="img/thumbnails/6bfb1953.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1953"><img src="img/thumbnails/6bfb1954.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1954"><img src="img/thumbnails/6bfb1958.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1958"><img src="img/thumbnails/6bfb1959.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1959"><img src="img/thumbnails/6bfb1960.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1960"><img src="img/thumbnails/6bfb1963.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1963"><img src="img/thumbnails/6bfb1966.jpg?<?php print time() ?>" width="120" height="80" alt="6bfb1966"><img src="img/thumbnails/6bfb1969.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1969"><img src="img/thumbnails/6bfb1972.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1972"><img src="img/thumbnails/6bfb1973.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1973"><img src="img/thumbnails/6bfb1974.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1974"><img src="img/thumbnails/6bfb1976.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1976"><img src="img/thumbnails/6bfb1977.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1977"><img src="img/thumbnails/6bfb1978.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1978"><img src="img/thumbnails/6bfb1979.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1979"><img src="img/thumbnails/6bfb1980.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1980"><img src="img/thumbnails/6bfb1981.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1981"><img src="img/thumbnails/6bfb1983.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1983"><img src="img/thumbnails/6bfb1984.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1984"><img src="img/thumbnails/6bfb1985.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1985"><img src="img/thumbnails/6bfb1986.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1986"><img src="img/thumbnails/6bfb1987.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1987"><img src="img/thumbnails/6bfb1988.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1988"><img src="img/thumbnails/6bfb1989.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1989"><img src="img/thumbnails/6bfb1990.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1990"><img src="img/thumbnails/6bfb1994.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1994"><img src="img/thumbnails/6bfb1995.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1995"><img src="img/thumbnails/6bfb1998.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1998"><img src="img/thumbnails/6bfb1999.jpg?<?php print time() ?>" width="80" height="120" alt="6bfb1999">
diff --git a/enabled_timeout.html b/enabled_timeout.html
index a0ed5ab7..e5243d9f 100644
--- a/enabled_timeout.html
+++ b/enabled_timeout.html
@@ -61,7 +61,7 @@ <h2>Plugin enabled</h2>
   <div class="entry">
     
     <p>
-      Here <a href="http://www.appelsiini.net/projects/lazyload plugin">Lazy Load</a> 
+      Here <a href="http://www.appelsiini.net/projects/lazyload">Lazy Load</a> 
       plugin is enabled. Images below the fold (the ones lower than window bottom) are not 
       loaded. Timeout will trigger five seconds after all elements of page have been loaded. 
       Scroll down the page and wait to see.
diff --git a/enabled_wide.html b/enabled_wide.html
index ce8988e3..20561bfa 100644
--- a/enabled_wide.html
+++ b/enabled_wide.html
@@ -61,6 +61,13 @@ <h2>Plugin enabled on Wide Page</h2>
       <a href="enabled_gazillion.html">gazillion images</a>.
     </p>
 
+    <code>
+      <pre>
+ $("img").lazyload({
+     placeholder : "img/grey.gif" 
+ });</pre>     
+    </code>
+
     <img src="img/bmw_m1_hood.jpg?<?php print time() ?>" width="765" height="574" alt="BMW M1 Hood">
     <img src="img/bmw_m1_side.jpg?<?php print time() ?>" width="765" height="574" alt="BMW M1 Side">
     <img src="img/viper_1.jpg?<?php print time() ?>" width="765" height="574" alt="Viper 1">