relatively-sticky

A jQuery plugin for creating smart sticky elements
git clone https://git.ce9e.org/relatively-sticky.git

commit
b76110db73cefb81107daa954efe41725f9d97e8
parent
17a5f9cd1bcc9a256b9a3ded3405919f58ac595d
Author
Tobias Bengfort <tobias.bengfort@gmx.net>
Date
2015-01-02 22:24
rm site

Diffstat

M Makefile 5 -----
M bower.json 1 -
D site/.gitignore 4 ----
D site/example.coffee 37 -------------------------------------
D site/example.scss 162 ------------------------------------------------------------
D site/examples/1.html 38 --------------------------------------
D site/examples/2.html 67 ------------------------------------------------------------
D site/examples/3.html 29 -----------------------------
D site/examples/4.html 60 ------------------------------------------------------------
D site/index.html 294 ------------------------------------------------------------
D site/main.coffee 16 ----------------
D site/main.scss 411 ------------------------------------------------------------
D site/site.moon 32 --------------------------------
D site/templates/example.html 19 -------------------
D site/templates/index.html 61 ------------------------------------------------------------
D site/www/.gitignore 6 ------
D site/www/images/sticky_water.png 0
D site/www/src/jquery.sticky-kit.js 242 ------------------------------------------------------------
D site/www/src/jquery.sticky-kit.min.js 9 ---------

19 files changed, 0 insertions, 1493 deletions


diff --git a/Makefile b/Makefile

@@ -4,8 +4,3 @@ jquery.sticky-kit.min.js: jquery.sticky-kit.js
    4     4 
    5     5 jquery.sticky-kit.js: jquery.sticky-kit.coffee
    6     6 	coffee -c $<
    7    -1 
    8    -1 
    9    -1 copy:
   10    -1 	cp jquery.sticky-kit.js site/www/src/
   11    -1 	cp jquery.sticky-kit.min.js site/www/src/

diff --git a/bower.json b/bower.json

@@ -13,7 +13,6 @@
   13    13   "license": "MIT",
   14    14   "ignore": [
   15    15     "**/.*",
   16    -1     "site",
   17    16     "test"
   18    17   ]
   19    18 }

diff --git a/site/.gitignore b/site/.gitignore

@@ -1,3 +0,0 @@
    1    -1 .sitegen_cache
    2    -1 www/*.js
    3    -1 www/*.cs
    3    -1 
\ No newline at end of file

diff --git a/site/example.coffee b/site/example.coffee

@@ -1,37 +0,0 @@
    1    -1 
    2    -1 # make it sticky
    3    -1 $ ->
    4    -1   $("[data-sticky_column]").stick_in_parent(parent: "[data-sticky_parent]")
    5    -1 
    6    -1 
    7    -1 reset_scroll = ->
    8    -1   scroller = $("body,html")
    9    -1   scroller.stop(true)
   10    -1 
   11    -1   if $(window).scrollTop() != 0
   12    -1     scroller.animate({ scrollTop: 0}, "fast")
   13    -1 
   14    -1   scroller
   15    -1 
   16    -1 window.scroll_it = ->
   17    -1   max = $(document).height() - $(window).height()
   18    -1   reset_scroll()
   19    -1     .animate({ scrollTop: max }, max*3)
   20    -1     .delay(100)
   21    -1     .animate({ scrollTop: 0 }, max*3)
   22    -1 
   23    -1 window.scroll_it_wobble = ->
   24    -1   max = $(document).height() - $(window).height()
   25    -1   third = Math.floor max / 3
   26    -1   reset_scroll()
   27    -1     .animate({ scrollTop: third * 2 }, max*3)
   28    -1     .delay(100)
   29    -1     .animate({ scrollTop: third }, max*3)
   30    -1     .delay(100)
   31    -1     .animate({ scrollTop: max }, max*3)
   32    -1     .delay(100)
   33    -1     .animate({ scrollTop: 0 }, max*3)
   34    -1 
   35    -1 
   36    -1 $(window).on "resize", (e) =>
   37    -1   $(document.body).trigger("sticky_kit:recalc")

diff --git a/site/example.scss b/site/example.scss

@@ -1,162 +0,0 @@
    1    -1 
    2    -1 $viewport_height: 200px;
    3    -1 
    4    -1 body {
    5    -1     margin: 0;
    6    -1     font-family: sans-serif;
    7    -1     font-size: 16px;
    8    -1 }
    9    -1 
   10    -1 h1 {
   11    -1     font-size: 30px;
   12    -1     margin: 10px;
   13    -1 }
   14    -1 
   15    -1 .content {
   16    -1     overflow: hidden;
   17    -1 
   18    -1     &.right {
   19    -1         .sidebar {
   20    -1             float: right;
   21    -1             margin: 10px;
   22    -1             margin-left: 0;
   23    -1         }
   24    -1 
   25    -1         .main {
   26    -1             margin: 10px;
   27    -1             margin-right: 220px;
   28    -1         }
   29    -1     }
   30    -1 
   31    -1     &.double {
   32    -1         .main {
   33    -1             margin-left: 430px + 4;
   34    -1         }
   35    -1     }
   36    -1 
   37    -1     .sidebar {
   38    -1         width: 200px;
   39    -1         height: floor($viewport_height / 3);
   40    -1         margin: 10px;
   41    -1         margin-right: 0;
   42    -1 
   43    -1         border: 1px solid red;
   44    -1         float: left;
   45    -1 
   46    -1         overflow: hidden;
   47    -1         font-family: sans-serif;
   48    -1 
   49    -1         &.alt {
   50    -1             height: floor($viewport_height * (2/3));
   51    -1         }
   52    -1 
   53    -1         &.tall {
   54    -1             height: $viewport_height * 2;
   55    -1         }
   56    -1 
   57    -1         &.medium {
   58    -1             height: $viewport_height * 1.5;
   59    -1         }
   60    -1 
   61    -1         &.flat {
   62    -1             border: 0;
   63    -1             height: auto;
   64    -1         }
   65    -1     }
   66    -1 
   67    -1     .inner {
   68    -1         border: 1px solid red;
   69    -1         height: floor($viewport_height / 3);
   70    -1         margin: 10px 0;
   71    -1 
   72    -1         &.static {
   73    -1             margin-top: 0;
   74    -1             border: 1px solid blue;
   75    -1         }
   76    -1     }
   77    -1 
   78    -1     .item {
   79    -1         display: inline-block;
   80    -1         vertical-align: top;
   81    -1         width: 120px;
   82    -1         border: 1px solid blue;
   83    -1         font-size: 16px;
   84    -1         margin: 10px;
   85    -1 
   86    -1         overflow: hidden;
   87    -1 
   88    -1         &.sticky {
   89    -1             border: 1px solid red;
   90    -1             height: 100px;
   91    -1         }
   92    -1     }
   93    -1 
   94    -1     .inline_columns {
   95    -1         font-size: 0;
   96    -1     }
   97    -1 
   98    -1     .main {
   99    -1         margin: 10px;
  100    -1         margin-left: 220px + 2;
  101    -1 
  102    -1         border: 1px solid blue;
  103    -1         height: $viewport_height * 2;
  104    -1 
  105    -1         overflow: hidden;
  106    -1 
  107    -1         &.short {
  108    -1             height: floor($viewport_height * (2/3));
  109    -1         }
  110    -1 
  111    -1         &.tall {
  112    -1             height: $viewport_height * 3;
  113    -1         }
  114    -1     }
  115    -1 }
  116    -1 
  117    -1 .footer {
  118    -1     margin: 10px;
  119    -1     text-align: center;
  120    -1     font-size: 13px;
  121    -1     border-top: 1px dashed #dadada;
  122    -1     color: #666;
  123    -1     padding-top: 10px;
  124    -1     min-height: floor($viewport_height * (2/3));
  125    -1 }
  126    -1 
  127    -1 .sub {
  128    -1     color: #999;
  129    -1 }
  130    -1 
  131    -1 
  132    -1 @media all and (max-width: 500px) {
  133    -1     .content {
  134    -1         .sidebar {
  135    -1             width: 100px;
  136    -1         }
  137    -1 
  138    -1         .item {
  139    -1             width: 60px;
  140    -1         }
  141    -1 
  142    -1         .main {
  143    -1             margin-left: 120px + 2;
  144    -1         }
  145    -1 
  146    -1         &.double {
  147    -1             .main {
  148    -1                 margin-left: 230px + 4;
  149    -1             }
  150    -1         }
  151    -1 
  152    -1         &.right {
  153    -1             .main {
  154    -1                 margin-right: 120px;
  155    -1             }
  156    -1         }
  157    -1 
  158    -1 
  159    -1 
  160    -1     }
  161    -1 }
  162    -1 

diff --git a/site/examples/1.html b/site/examples/1.html

@@ -1,38 +0,0 @@
    1    -1 
    2    -1 <h1>My Site</h1>
    3    -1 <div class="content" data-sticky_parent>
    4    -1   <div class="sidebar" data-sticky_column>
    5    -1     This is a sticky column
    6    -1   </div>
    7    -1 
    8    -1   <div class="main" data-sticky_column>
    9    -1     This is the main column
   10    -1     <p class="sub">
   11    -1       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tempus id
   12    -1       leo et aliquam. Proin consectetur ligula vel neque cursus laoreet. Nullam
   13    -1       dignissim, augue at consectetur pellentesque, metus ipsum interdum
   14    -1       sapien, quis ornare quam enim vel ipsum.
   15    -1     </p>
   16    -1 
   17    -1     <p class="sub">
   18    -1       In congue nunc vitae magna
   19    -1       tempor ultrices. Cras ultricies posuere elit. Nullam ultrices purus ante,
   20    -1       at mattis leo placerat ac. Nunc faucibus ligula nec lorem sodales
   21    -1       venenatis. Curabitur nec est condimentum, blandit tellus nec, semper
   22    -1       arcu. Nullam in porta ipsum, non consectetur mi. Sed pharetra sapien
   23    -1       nisl. Aliquam ac lectus sed elit vehicula scelerisque ut vel sem. Ut ut
   24    -1       semper nisl.
   25    -1     </span>
   26    -1 
   27    -1     <p class="sub">
   28    -1       Curabitur rhoncus, arcu at placerat volutpat, felis elit sollicitudin ante, sed
   29    -1       tempus justo nibh sed massa. Integer vestibulum non ante ornare eleifend. In
   30    -1       vel mollis dolor.
   31    -1     </p>
   32    -1 
   33    -1 
   34    -1   </div>
   35    -1 </div>
   36    -1 <div class="footer">
   37    -1   My very tall footer!
   38    -1 </div>

diff --git a/site/examples/2.html b/site/examples/2.html

@@ -1,67 +0,0 @@
    1    -1 
    2    -1 <h1>My Better Site</h1>
    3    -1 
    4    -1 <div class="content double" data-sticky_parent>
    5    -1 
    6    -1   <div class="sidebar alt" data-sticky_column>
    7    -1     This is a sticky column
    8    -1   </div>
    9    -1 
   10    -1   <div class="sidebar flat">
   11    -1     <div class="inner static">Doesn't stick</div>
   12    -1     <div class="inner" data-sticky_column>Sticks</div>
   13    -1   </div>
   14    -1 
   15    -1   <div class="main" data-sticky_column>
   16    -1     This is the main column
   17    -1     <p class="sub">
   18    -1       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tempus id
   19    -1       leo et aliquam. Proin consectetur ligula vel neque cursus laoreet. Nullam
   20    -1       dignissim, augue at consectetur pellentesque, metus ipsum interdum
   21    -1       sapien, quis ornare quam enim vel ipsum.
   22    -1     </p>
   23    -1 
   24    -1     <p class="sub">
   25    -1       In congue nunc vitae magna
   26    -1       tempor ultrices. Cras ultricies posuere elit. Nullam ultrices purus ante,
   27    -1       at mattis leo placerat ac. Nunc faucibus ligula nec lorem sodales
   28    -1       venenatis.
   29    -1     </span>
   30    -1 
   31    -1   </div>
   32    -1 </div>
   33    -1 
   34    -1 <div class="content right" data-sticky_parent>
   35    -1   <div class="sidebar" data-sticky_column>
   36    -1     Welcome to my sidebar
   37    -1   </div>
   38    -1 
   39    -1   <div class="main inline_columns" data-sticky_column data-sticky_parent>
   40    -1     <div class="item">
   41    -1       Hello
   42    -1 
   43    -1       <p class="sub">
   44    -1         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tempus id
   45    -1         leo et aliquam. Proin consectetur ligula vel neque cursus laoreet.
   46    -1       </p>
   47    -1 
   48    -1     </div>
   49    -1     <div class="item sticky" data-sticky_column>Sticky</div>
   50    -1 
   51    -1 
   52    -1     <div class="item">
   53    -1       World!
   54    -1 
   55    -1       <p class="sub">
   56    -1         In congue nunc vitae magna tempor ultrices. Cras ultricies posuere
   57    -1         elit. Nullam ultrices purus ante, at mattis leo placerat ac.
   58    -1       </span>
   59    -1 
   60    -1     </div>
   61    -1   </div>
   62    -1 </div>
   63    -1 
   64    -1 
   65    -1 <div class="footer">
   66    -1   My very tall footer!
   67    -1 </div>

diff --git a/site/examples/3.html b/site/examples/3.html

@@ -1,29 +0,0 @@
    1    -1 
    2    -1 <h1>My Other Site</h1>
    3    -1 <div class="content" data-sticky_parent>
    4    -1   <div class="sidebar tall" data-sticky_column>
    5    -1     Welcome to my sidebar
    6    -1     <p class="sub">
    7    -1       In congue nunc vitae magna
    8    -1       tempor ultrices. Cras ultricies posuere elit. Nullam ultrices purus ante,
    9    -1       at mattis leo placerat ac. Nunc faucibus ligula nec lorem sodales
   10    -1       venenatis. Curabitur nec est condimentum, blandit tellus nec, semper
   11    -1       arcu. Nullam in porta ipsum, non consectetur mi. Sed pharetra sapien
   12    -1       nisl. Aliquam ac lectus sed elit vehicula scelerisque ut vel sem. Ut ut
   13    -1       semper nisl.
   14    -1     </span>
   15    -1   </div>
   16    -1 
   17    -1   <div class="main short" data-sticky_column>
   18    -1     This is the main column
   19    -1     <p class="sub">
   20    -1       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tempus id
   21    -1       leo et aliquam. Proin consectetur ligula vel neque cursus laoreet. Nullam
   22    -1       dignissim, augue at consectetur pellentesque, metus ipsum interdum
   23    -1       sapien, quis ornare quam enim vel ipsum.
   24    -1     </p>
   25    -1   </div>
   26    -1 </div>
   27    -1 <div class="footer">
   28    -1   My very tall footer!
   29    -1 </div>

diff --git a/site/examples/4.html b/site/examples/4.html

@@ -1,60 +0,0 @@
    1    -1 
    2    -1 <h1>My Last Site</h1>
    3    -1 <div class="content" data-sticky_parent>
    4    -1   <div class="sidebar medium" data-sticky_column>
    5    -1     Very tall sidebar
    6    -1     <ul class="sub">
    7    -1       <li>backorder</li>
    8    -1       <li>lozenge</li>
    9    -1       <li>shipper</li>
   10    -1       <li>roach</li>
   11    -1       <li>range</li>
   12    -1       <li>parke</li>
   13    -1       <li>reliever</li>
   14    -1       <li>incorrectness</li>
   15    -1       <li>schemed</li>
   16    -1       <li>philosophically</li>
   17    -1       <li>chopped</li>
   18    -1       <li>loggerhead</li>
   19    -1       <li>hosts</li>
   20    -1     </ul>
   21    -1   </div>
   22    -1 
   23    -1   <div class="main tall" data-sticky_column>
   24    -1     This is the main column
   25    -1     <p class="sub">
   26    -1       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tempus id
   27    -1       leo et aliquam. Proin consectetur ligula vel neque cursus laoreet. Nullam
   28    -1       dignissim, augue at consectetur pellentesque, metus ipsum interdum
   29    -1       sapien, quis ornare quam enim vel ipsum.
   30    -1     </p>
   31    -1     <p class="sub">
   32    -1       In congue nunc vitae magna
   33    -1       tempor ultrices. Cras ultricies posuere elit. Nullam ultrices purus ante,
   34    -1       at mattis leo placerat ac. Nunc faucibus ligula nec lorem sodales
   35    -1       venenatis. Curabitur nec est condimentum, blandit tellus nec, semper
   36    -1       arcu. Nullam in porta ipsum, non consectetur mi. Sed pharetra sapien
   37    -1       nisl. Aliquam ac lectus sed elit vehicula scelerisque ut vel sem. Ut ut
   38    -1       semper nisl.
   39    -1     </span>
   40    -1 
   41    -1     <p class="sub">
   42    -1       Curabitur rhoncus, arcu at placerat volutpat, felis elit sollicitudin ante, sed
   43    -1       tempus justo nibh sed massa. Integer vestibulum non ante ornare eleifend. In
   44    -1       vel mollis dolor. Curabitur sed est felis. Nam luctus dapibus leo, vitae porta
   45    -1       erat feugiat id. Nullam nulla diam, laoreet a nisl nec, porta sodales quam.
   46    -1       Aenean in sem vitae neque aliquam commodo vitae sit amet sem. Ut commodo
   47    -1       imperdiet lorem non lacinia. Suspendisse fringilla mi enim, at imperdiet sem
   48    -1       tincidunt et. Vivamus sit amet aliquam leo. Nullam cursus ante sed urna
   49    -1       bibendum blandit. Quisque fringilla metus et nisi vehicula, et ultricies ante
   50    -1       ultrices.
   51    -1     </p>
   52    -1   </div>
   53    -1 </div>
   54    -1 <div class="footer">
   55    -1   My very tall footer!
   56    -1 </div>
   57    -1 
   58    -1 <script type="text/javascript">
   59    -1 scroll_it = scroll_it_wobble
   60    -1 </script>

diff --git a/site/index.html b/site/index.html

@@ -1,294 +0,0 @@
    1    -1 
    2    -1 <div class="nav">
    3    -1   <div class="nav_social hidden">
    4    -1     <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://leafo.net/sticky-kit/" data-text="Sticky-kit v$version - A jQuery plugin for sticky elements" data-count="horizontal" data-via="moonscript">Tweet</a>
    5    -1     <a href="https://twitter.com/moonscript" class="twitter-follow-button" data-width="70px" data-show-count="false" data-show-screen-name="false">Follow @moonscript</a>
    6    -1   </div>
    7    -1 
    8    -1   <a href="#examples">Examples</a>
    9    -1   <a href="#reference">Reference</a>
   10    -1   <a href="https://rawgithub.com/leafo/sticky-kit/v$version/jquery.sticky-kit.min.js" class="hidden">Download</a>
   11    -1 </div>
   12    -1 
   13    -1 
   14    -1 $markdown{[[
   15    -1 Sticky-kit provides an easy way to attach elements to the page when the user
   16    -1 scrolls such that the element is always visible. The source can be found on
   17    -1 [GitHub](https://github.com/leafo/sticky-kit).
   18    -1 ]]}
   19    -1 
   20    -1 <div class="github_buttons">
   21    -1 <iframe src="http://ghbtns.com/github-btn.html?user=leafo&repo=sticky-kit&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="110px" height="20px"></iframe>
   22    -1 <iframe src="http://ghbtns.com/github-btn.html?user=leafo&repo=sticky-kit&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="95px" height="20px"></iframe>
   23    -1 </div>
   24    -1 
   25    -1 <h1>
   26    -1   Examples
   27    -1   <a name="examples" class="anchor"></a>
   28    -1 </h1>
   29    -1 
   30    -1 <h2>Basic Sticking</h2>
   31    -1 
   32    -1 <div class="example">
   33    -1 
   34    -1 $markdown{[[
   35    -1 Just call `stick_in_parent` on the elements you want to be stuck inside of
   36    -1 their parent. Sticky elements "bottom out" so they never leave the container,
   37    -1 no more worrying if a sticky element will accidentally cover your footer.
   38    -1 ]]}
   39    -1 
   40    -1 <div class="example_controls">
   41    -1 <button>Scroll it!</button>
   42    -1 $markdown{[[
   43    -1 ```js
   44    -1 $("#sidebar").stick_in_parent();
   45    -1 ```
   46    -1 ]]}
   47    -1 </div>
   48    -1 
   49    -1 <div class="window_frame pink">
   50    -1   <div class="window_title">Demo Browser</div>
   51    -1   <div class="window_inner">
   52    -1     <iframe src="$root/examples/1.html" frameborder="0"></iframe>
   53    -1   </div>
   54    -1 </div>
   55    -1 </div>
   56    -1 
   57    -1 
   58    -1 <h2>Many Sticky Items</h2>
   59    -1 
   60    -1 <div class="example">
   61    -1 
   62    -1 $markdown{[[
   63    -1 Have a lot of sticky columns, or different sticky portions of the page? Call
   64    -1 `stick_in_parent` on all the elements at once.
   65    -1 ]]}
   66    -1 
   67    -1 <div class="example_controls">
   68    -1 <button>Scroll it!</button>
   69    -1 $markdown{[[
   70    -1 ```js
   71    -1 $(".sticky_column").stick_in_parent();
   72    -1 ```
   73    -1 ]]}
   74    -1 </div>
   75    -1 
   76    -1 <div class="window_frame pink">
   77    -1   <div class="window_title">Demo Browser</div>
   78    -1   <div class="window_inner">
   79    -1     <iframe src="$root/examples/2.html" frameborder="0"></iframe>
   80    -1   </div>
   81    -1 </div>
   82    -1 </div>
   83    -1 
   84    -1 
   85    -1 <div class="example">
   86    -1 $markdown{[[
   87    -1 Not sure if your sidebar or your main content is taller? Doesn't matter, just
   88    -1 call `stick_in_parent` on all columns. Sticky-kit will only stick items if they
   89    -1 don't take up the entire height of their parent.
   90    -1 ]]}
   91    -1 
   92    -1 <div class="example_controls long_example">
   93    -1 <button>Scroll it!</button>
   94    -1 $markdown{[[
   95    -1 ```js
   96    -1 $("#sidebar, #main_column").stick_in_parent();
   97    -1 ```
   98    -1 ]]}
   99    -1 </div>
  100    -1 
  101    -1 <div class="window_frame pink">
  102    -1   <div class="window_title">Demo Browser</div>
  103    -1   <div class="window_inner">
  104    -1     <iframe src="$root/examples/3.html" frameborder="0"></iframe>
  105    -1   </div>
  106    -1 </div>
  107    -1 </div>
  108    -1 
  109    -1 <h2>Scrollable Sticky Element</h2>
  110    -1 
  111    -1 <div class="example">
  112    -1 $markdown{[[
  113    -1 Sticky elements taller than the viewport can scroll independently up and down,
  114    -1 meaning you don't have to worry about your content being cut off should the
  115    -1 sticky element be too tall or the user's resolution too small.
  116    -1 ]]}
  117    -1 
  118    -1 <div class="example_controls">
  119    -1 <button>Scroll it!</button>
  120    -1 $markdown{[[
  121    -1 ```js
  122    -1 $("#sidebar").stick_in_parent();
  123    -1 ```
  124    -1 ]]}
  125    -1 </div>
  126    -1 <div class="window_frame pink">
  127    -1   <div class="window_title">Demo Browser</div>
  128    -1   <div class="window_inner">
  129    -1     <iframe src="$root/examples/4.html" frameborder="0"></iframe>
  130    -1   </div>
  131    -1 </div>
  132    -1 </div>
  133    -1 
  134    -1 
  135    -1 <h1>
  136    -1   Reference
  137    -1   <a name="reference" class="anchor"></a>
  138    -1 </h1>
  139    -1 
  140    -1 $markdown{[[
  141    -1 
  142    -1 To install include `jquery.sticky-kit.js` after including jQuery.
  143    -1 
  144    -1 Usage:
  145    -1 
  146    -1 ```js
  147    -1 $("#sticky_item").stick_in_parent();
  148    -1 // or
  149    -1 $("#sticky_item").stick_in_parent(options);
  150    -1 ```
  151    -1 
  152    -1 You can pass a hash of options to configure how Sticky Kit works. The following
  153    -1 options are accepted, each one is optional:
  154    -1 
  155    -1 * `parent` -- The element will be the parent of the sticky item. The
  156    -1   dimensions of the parent control when the sticky element bottoms out. Defaults
  157    -1   to the closest parent of the sticky element. Can be a selector.
  158    -1 * `inner_scrolling` -- Boolean to enable or disable the ability of the sticky
  159    -1   element to scroll independently of the scrollbar when it's taller than the
  160    -1   viewport. Defaults to `true` for enabled.
  161    -1 * `sticky_class` -- The name of the CSS class to apply to elements when they
  162    -1   have become stuck. Defaults to `"is_stuck"`.
  163    -1 * `offset_top` -- offsets the initial sticking position by of number of pixels,
  164    -1   can be either negative or positive
  165    -1 * `spacer` -- either a selector to use for the spacer element, or `false` to
  166    -1   disable the spacer. The selector is passed to
  167    -1   [`closest`](http://api.jquery.com/closest/), so you should nest the sticky
  168    -1   element within the spacer. Defaults to Stiky Kit creating its own spacer.
  169    -1 * `bottoming` -- Boolean to control whether elements bottom out. Defaults to `true`
  170    -1 * `recalc_every` -- Integeger specifying that a recalc should automatically
  171    -1   take place between that many ticks. A tick takes place on every scroll event.
  172    -1   Defaults to never calling recalc on a tick.
  173    -1 
  174    -1 ### Events
  175    -1 
  176    -1 Various events are triggered from a sticky element when its state changes.
  177    -1 They are:
  178    -1 
  179    -1 * `sticky_kit:stick` -- Triggered when element becomes stuck.
  180    -1 * `sticky_kit:unstick` -- Triggered when element becomes unstuck. (Note: an
  181    -1   element is still considered stuck when it has bottomed out)
  182    -1 * `sticky_kit:bottom` -- Triggered when element bottoms out.
  183    -1 * `sticky_kit:unbottom` -- Triggered when element is no longer bottomed out.
  184    -1 
  185    -1 
  186    -1 For example, if we want to log when an element sticks and unsticks we might do:
  187    -1 
  188    -1 ```js
  189    -1 $("#sticky_item").stick_in_parent()
  190    -1   .on("sticky_kit:stick", function(e) {
  191    -1     console.log("has stuck!", e.target);
  192    -1   })
  193    -1   .on("sticky_kit:unstick", function(e) {
  194    -1     console.log("has unstuck!", e.target);
  195    -1   });
  196    -1 ```
  197    -1 
  198    -1 Sticky Kit listens to one event on `document.body`.
  199    -1 
  200    -1 * `sticky_kit:recalc` -- trigger this event to cause all sticky elements to be
  201    -1   recalculated. More information below.
  202    -1 
  203    -1 
  204    -1 Sticky Kit also listens to an event on the sticky elements:
  205    -1 
  206    -1 * `sticky_kit:detach` -- remove sticky kit and restore element to original
  207    -1   position
  208    -1 
  209    -1 If you want to remove sticky kit from an element after applying it you can send
  210    -1 that element a `sticky_kit:detach` event.
  211    -1 
  212    -1 For example:
  213    -1 
  214    -1 ```js
  215    -1 $("#sticky_item").trigger("sticky_kit:detach");
  216    -1 ```
  217    -1 
  218    -1 ### Recalculating Sticky Elements
  219    -1 
  220    -1 If you're changing the markup of your page on the fly by removing, adding or
  221    -1 resizing elements then you most likely need to tell Sticky Kit to recalculate
  222    -1 the sticky elements to guarantee they're positioned correctly.
  223    -1 
  224    -1 You can manually cause a recalculation to happen by triggering an event on
  225    -1 `document.body`:
  226    -1 
  227    -1 ```js
  228    -1 $(document.body).trigger("sticky_kit:recalc");
  229    -1 ```
  230    -1 
  231    -1 Typically you only need to trigger a recalculation if you are changing the
  232    -1 positions/sizes of elements above the sticky element, adjacent to it, or the
  233    -1 sticky element itself.
  234    -1 
  235    -1 Sticky kit has two types of internal actions, a `recalc` and a `tick`. A
  236    -1 recalculation happens very rarely, by default only on start up and on page
  237    -1 resize. It caches the sizes and positioning CSS of all the elements that it
  238    -1 needs to interact with.
  239    -1 
  240    -1 A `tick` happens on every scroll event. It's a light weight function checks the
  241    -1 cached values and updates state accordingly. This is done to keep the least
  242    -1 amount of code running on each scroll event to help prevent jank and give more
  243    -1 time to any other scroll event listeners you might have.
  244    -1 
  245    -1 Instead of manually calling `sticky_kit:recalc` you can use the `recalc_every`
  246    -1 option described above to periodically do a recalculation between ticks.
  247    -1 Setting it to 1 will cause a recalculation to happen on every scroll event,
  248    -1 preventing the state from ever being out of date.
  249    -1 
  250    -1 ```js
  251    -1 $("#sticky_item").stick_in_parent({recalc_every: 1});
  252    -1 ```
  253    -1 
  254    -1 ### About Columns
  255    -1 
  256    -1 If you're familiar with HTML and CSS then you probably know there are a handful
  257    -1 of different ways to make columns. Sticky kit works automatically with floated
  258    -1 columns, `inline-block` columns, or absolutely positioned elements. (Non column
  259    -1 elements like toolbars work great as well, for example the toolbar on this
  260    -1 site.)
  261    -1 
  262    -1 ### Browser Support
  263    -1 
  264    -1 Sticky Kit works with all modern browsers, and IE7+.
  265    -1 
  266    -1 Note: only floated columns work in IE7.
  267    -1 
  268    -1 ]]}
  269    -1 
  270    -1 <h1>
  271    -1   Changelog
  272    -1   <a name="changelog" class="anchor"></a>
  273    -1 </h1>
  274    -1 
  275    -1 $markdown{[[
  276    -1   * **v1.1.1** - *Nov 23, 2014* -- Fix issue where tick/recalc could get called
  277    -1   after detach which would cause sticky element to be removed. Full height
  278    -1   calculation takes offset into account (johnwchadwick)
  279    -1   * **v1.1.0** - *Nov 13, 2014* -- Add `recalc_every`, `bottoming`, and
  280    -1   `spacer` options. Fix bug where some events weren't getting removed on
  281    -1   detach. Fixed bug where sticky class was not removed on detach (poziworld),
  282    -1   pull `jQuery` from `window` if it can't be found on `this` (Connor Peet)
  283    -1   * **v1.0.4** - *Mar 29, 2014* -- `touchmove` events for mobile (Alfredo
  284    -1   Motta), support absolutely positioned element (Pierre Spring), `border-box`
  285    -1   element sets spacer correctly (jasonpolito), bug fix for bottomed state (Pierre
  286    -1   Spring)
  287    -1   * **v1.0.2** *Nov 16, 2013* -- Add `sticky_kit:detach`, Bug fixes: remove
  288    -1   stray top attribute when unfixing, fix issue with top when inner scrolling,
  289    -1   handle variable width elements correctly, recalc is called on window resize
  290    -1   * **v1.0.1** *Sept 11, 2013* -- Added offset_top option, fixed recaclc when items are
  291    -1     already stuck
  292    -1   * **v1.0.0** *Aug 1, 2013* -- Initial release
  293    -1 ]]}
  294    -1 

diff --git a/site/main.coffee b/site/main.coffee

@@ -1,16 +0,0 @@
    1    -1 
    2    -1 $ ->
    3    -1   $("body").on "click", ".example_controls button", (e) =>
    4    -1     $(e.currentTarget)
    5    -1       .closest(".example").find("iframe")[0].contentWindow.scroll_it()
    6    -1 
    7    -1 
    8    -1   $(".nav").stick_in_parent().on("sticky_kit:stick", (e) =>
    9    -1     setTimeout =>
   10    -1       $(e.target).addClass "show_hidden"
   11    -1     , 0
   12    -1   ).on("sticky_kit:unstick", (e) =>
   13    -1     setTimeout =>
   14    -1       $(e.target).removeClass "show_hidden"
   15    -1     , 0
   16    -1   )

diff --git a/site/main.scss b/site/main.scss

@@ -1,411 +0,0 @@
    1    -1 
    2    -1 $site_width: 700px;
    3    -1 $narrow_site_width: 500px;
    4    -1 $font_size: 18px;
    5    -1 
    6    -1 ::selection {
    7    -1     background: red;
    8    -1     color: white;
    9    -1 }
   10    -1 
   11    -1 @mixin unselectable {
   12    -1     -moz-user-select: none;
   13    -1     -webkit-user-select: none;
   14    -1     user-select: none;
   15    -1 }
   16    -1 
   17    -1 @mixin grad($top, $bottom) {
   18    -1     background-color: mix($top, $bottom);
   19    -1     background-image: linear-gradient(bottom, $bottom 0%, $top 100%);
   20    -1     background-image: -webkit-linear-gradient(bottom, $bottom 0%, $top 100%);
   21    -1     background-image: -moz-linear-gradient(bottom, $bottom 0%, $top 100%);
   22    -1     background-image: -o-linear-gradient(bottom, $bottom 0%, $top 100%);
   23    -1     background-image: -ms-linear-gradient(bottom, $bottom 0%, $top 100%);
   24    -1 }
   25    -1 
   26    -1 @mixin autograd($color, $amount: 10%) {
   27    -1     @include grad($color, darken($color, $amount));
   28    -1 }
   29    -1 
   30    -1 
   31    -1 body {
   32    -1     font-family: Lato, sans-serif;
   33    -1     font-size: $font_size;
   34    -1     color: #222;
   35    -1     margin: 0;
   36    -1 }
   37    -1 
   38    -1 a {
   39    -1     color: #E73E1D;
   40    -1     &:hover {
   41    -1         color: lighten(#E73E1D, 10%);
   42    -1     }
   43    -1 
   44    -1     &.anchor {
   45    -1         visibility: hidden;
   46    -1         display: block;
   47    -1         position: relative;
   48    -1         top: -100px;
   49    -1     }
   50    -1 }
   51    -1 
   52    -1 h1 {
   53    -1     margin: 40px 0;
   54    -1 }
   55    -1 
   56    -1 p, ul {
   57    -1     line-height: 26px;
   58    -1     margin: 20px 0;
   59    -1 
   60    -1     code {
   61    -1         background: #eee;
   62    -1         padding: 2px 4px;
   63    -1         border-radius: 4px;
   64    -1         border: 1px solid darken(#eee, 5%);
   65    -1     }
   66    -1 }
   67    -1 
   68    -1 
   69    -1 li {
   70    -1     margin: 15px 0;
   71    -1 }
   72    -1 
   73    -1 .header {
   74    -1     margin: 20px 0;
   75    -1     padding-bottom: 20px;
   76    -1     border-bottom: 1px solid #dadada;
   77    -1     white-space: nowrap;
   78    -1 
   79    -1     h1 {
   80    -1         font-size: 100px;
   81    -1         margin: 0;
   82    -1     }
   83    -1 
   84    -1     h2 {
   85    -1         font-size: 18px;
   86    -1         font-weight: normal;
   87    -1         margin: 0;
   88    -1         color: #666;
   89    -1     }
   90    -1 
   91    -1     .downloader {
   92    -1         $color: #90C497;
   93    -1 
   94    -1         margin-top: 2px;
   95    -1         float: right;
   96    -1         text-align: center;
   97    -1         width: 220px;
   98    -1 
   99    -1         .download_label {
  100    -1             color: #999;
  101    -1             font-size: 14px;
  102    -1             margin-bottom: 10px;
  103    -1         }
  104    -1 
  105    -1         .download_outer {
  106    -1             @include autograd($color, 20%);
  107    -1             border-radius: 10px;
  108    -1             border: 1px solid desaturate(darken($color, 20%), 10%);
  109    -1             box-shadow: inset 0 -1px 0 $color, 0 0 0 4px white, 0 0 0 5px #dadada;
  110    -1             font-size: 0;
  111    -1         }
  112    -1 
  113    -1         a {
  114    -1             font-size: 16px;
  115    -1             color: white;
  116    -1             text-decoration: none;
  117    -1             text-shadow: 0 0 4px darken($color, 20%);
  118    -1             font-weight: bold;
  119    -1         }
  120    -1 
  121    -1         .size {
  122    -1             font-weight: normal;
  123    -1         }
  124    -1 
  125    -1 
  126    -1         .download_row {
  127    -1             display: block;
  128    -1             padding: 10px;
  129    -1         }
  130    -1 
  131    -1         .top_row {
  132    -1             background-color: rgba(255,255,255,0.1);
  133    -1             box-shadow: 0 1px 0 rgba(0,0,0,0.1);
  134    -1         }
  135    -1     }
  136    -1 
  137    -1     .twitter_buttons {
  138    -1         margin-top: 15px;
  139    -1     }
  140    -1 }
  141    -1 
  142    -1 
  143    -1 .nav {
  144    -1     $height: 50px;
  145    -1 
  146    -1     color: white;
  147    -1     height: $height;
  148    -1     line-height: $height;
  149    -1     background: #222;
  150    -1     padding: 0 10px;
  151    -1     z-index: 3;
  152    -1 
  153    -1     box-shadow: 0 0px 0 rgba(0,0,0, 0.1);
  154    -1 
  155    -1     -webkit-transition: box-shadow 0.25s ease-in-out;
  156    -1     -moz-transition: box-shadow 0.25s ease-in-out;
  157    -1     transition: box-shadow 0.25s ease-in-out;
  158    -1 
  159    -1     &.show_hidden {
  160    -1         box-shadow: 0 3px 0 rgba(0,0,0, 0.1);
  161    -1 
  162    -1         .hidden {
  163    -1             opacity: 1;
  164    -1         }
  165    -1     }
  166    -1 
  167    -1     .hidden {
  168    -1         opacity: 0;
  169    -1         -webkit-transition: opacity 0.25s ease-in-out;
  170    -1         -moz-transition: opacity 0.25s ease-in-out;
  171    -1         transition: opacity 0.25s ease-in-out;
  172    -1     }
  173    -1 
  174    -1     .nav_social {
  175    -1         float: right;
  176    -1     }
  177    -1 
  178    -1     a {
  179    -1         display: inline-block;
  180    -1         height: $height;
  181    -1         line-height: $height;
  182    -1         padding: 0 10px;
  183    -1 
  184    -1         color: white;
  185    -1         text-decoration: none;
  186    -1         margin-right: 20px;
  187    -1 
  188    -1         -webkit-transition: background 0.15s ease-in-out;
  189    -1         -moz-transition: background 0.15s ease-in-out;
  190    -1         transition: background 0.15s ease-in-out;
  191    -1 
  192    -1         &:hover {
  193    -1             background-color: #444;
  194    -1         }
  195    -1     }
  196    -1 }
  197    -1 
  198    -1 .body {
  199    -1     width: $site_width;
  200    -1     margin-left: auto;
  201    -1     margin-right: auto;
  202    -1     position: relative;
  203    -1     z-index: 2;
  204    -1 
  205    -1     &:before {
  206    -1         z-index: 1;
  207    -1         position: absolute;
  208    -1         width: 290px;
  209    -1         height: 655px;
  210    -1         left: -290px;
  211    -1         content: " ";
  212    -1         background: url("images/sticky_water.png")
  213    -1     }
  214    -1 }
  215    -1 
  216    -1 
  217    -1 .example {
  218    -1     margin: 40px 0;
  219    -1 
  220    -1     .example_controls {
  221    -1         button {
  222    -1             margin: 13px 10px 0 0;
  223    -1             float: right;
  224    -1         }
  225    -1     }
  226    -1 
  227    -1     iframe {
  228    -1         display: block;
  229    -1         width: $site_width - 8px;
  230    -1         margin: 0 auto;
  231    -1         margin-bottom: 1px;
  232    -1         border: 1px solid silver;
  233    -1         height: 200px;
  234    -1         background: white;
  235    -1     }
  236    -1 
  237    -1 }
  238    -1 
  239    -1 .footer {
  240    -1     background: #eee;
  241    -1     border-top: 1px dashed #dadada;
  242    -1     overflow: hidden;
  243    -1     margin-top: 40px;
  244    -1     font-size: 14px;
  245    -1     color: #444;
  246    -1     box-shadow: inset 0 1px 0 white;
  247    -1 
  248    -1     .inner {
  249    -1         width: $site_width;
  250    -1         margin: 0 auto;
  251    -1 
  252    -1         div {
  253    -1             margin: 10px;
  254    -1         }
  255    -1     }
  256    -1 
  257    -1     a {
  258    -1         color: #222;
  259    -1         &:hover {
  260    -1             color: black;
  261    -1         }
  262    -1     }
  263    -1 }
  264    -1 
  265    -1 
  266    -1 // code
  267    -1 
  268    -1 .highlight {
  269    -1     border: 1px dashed #c7c7c7;
  270    -1     border-radius: 6px;
  271    -1     padding: 10px;
  272    -1     margin: 20px 0;
  273    -1     line-height: 26px;
  274    -1 
  275    -1     box-shadow: 0 0 0 1px #FFF, 0 0 7px #B3B3B3;
  276    -1 }
  277    -1 
  278    -1 /* builtins */
  279    -1 .nb {
  280    -1     color: #707A34;
  281    -1 }
  282    -1 
  283    -1 /* strings */
  284    -1 .s, .s1, .s2, .se {
  285    -1     color: #A16D43;
  286    -1 }
  287    -1 
  288    -1 /* proper names, self */
  289    -1 .nc, .vc, .bp, .kc {
  290    -1     color: #30A0BD;
  291    -1 }
  292    -1 
  293    -1 /* function lit, braces, parens  */
  294    -1 .nf, .kt, .p {
  295    -1     color: #8E4681;
  296    -1 }
  297    -1 
  298    -1 /* operators */
  299    -1 .o, .si {
  300    -1     color: #B50C0C;
  301    -1 }
  302    -1 
  303    -1 .nv {
  304    -1     color: #ff9898;
  305    -1     color: #893D8C;
  306    -1 }
  307    -1 
  308    -1 /* keywords */
  309    -1 .k, .kd {
  310    -1     color: #0CB56C;
  311    -1 }
  312    -1 
  313    -1 .c1, .c2 {
  314    -1     color: #D74DBF;
  315    -1 }
  316    -1 
  317    -1 .m, .mi, .mf, .mh {
  318    -1     color: #4958C3;
  319    -1 }
  320    -1 
  321    -1 .window_frame {
  322    -1     overflow: hidden;
  323    -1     margin: 20px 0;
  324    -1 
  325    -1     background: #EDECEB;
  326    -1 
  327    -1     box-shadow: inset 0 0 0 1px #6D6A68, inset 2px 0 0 white, inset 0 0 0 2px #D2D0CE, 0 0 10px rgba(0,0,0, 0.3);
  328    -1     border-radius: 4px 4px 0 0;
  329    -1 
  330    -1     .window_inner {
  331    -1         padding: 2px;
  332    -1     }
  333    -1 
  334    -1     .window_title {
  335    -1         $border: #455D7C;
  336    -1         $top_highlight: #B2CCED;
  337    -1         $left_side_highlight: #9EBDE5;
  338    -1         $right_side_highlight: #7BA2D3;
  339    -1         $bottom_shadow: #4E76A8;
  340    -1         $text_outline: #4E77AB;
  341    -1 
  342    -1         border: 1px solid $border;
  343    -1         border-bottom: 0;
  344    -1 
  345    -1         border-radius: 4px 4px 0 0;
  346    -1         font-size: 14px;
  347    -1         font-weight: bold;
  348    -1         text-align: center;
  349    -1         height: 22px;
  350    -1         line-height: 22px;
  351    -1         background: #99BAE3;
  352    -1         @include grad(#99BAE3, #7AA1D1);
  353    -1 
  354    -1         box-shadow: inset 0 1px 0 0 $top_highlight, inset 1px 0 0 $left_side_highlight, inset -1px 0 0 $right_side_highlight, 0 2px 0 -1px $bottom_shadow;
  355    -1         color: white;
  356    -1         text-shadow: 1px 1px 0 $text_outline, 1px -1px $text_outline, -1px -1px $text_outline, -1px 1px $text_outline;
  357    -1     }
  358    -1 
  359    -1     &.pink {
  360    -1         .window_title {
  361    -1             $border: #94487A;
  362    -1             $top_highlight: #F3B3DD;
  363    -1             $left_side_highlight: #EDA1D3;
  364    -1             $right_side_highlight: #DE7EBD;
  365    -1             $bottom_shadow: #BA5096;
  366    -1             $text_outline: #BD5198;
  367    -1 
  368    -1             border: 1px solid $border;
  369    -1             border-bottom: 0;
  370    -1 
  371    -1             background: #EB99CF;
  372    -1             @include grad(#EB99CF, #DE7EBD);
  373    -1 
  374    -1             box-shadow: inset 0 1px 0 0 $top_highlight, inset 1px 0 0 $left_side_highlight, inset -1px 0 0 $right_side_highlight, 0 2px 0 -1px $bottom_shadow;
  375    -1             text-shadow: 1px 1px 0 $text_outline, 1px -1px $text_outline, -1px -1px $text_outline, -1px 1px $text_outline;
  376    -1         }
  377    -1     }
  378    -1 }
  379    -1 
  380    -1 @media all and (max-width: 1015px) {
  381    -1     .forkme {
  382    -1         display: none;
  383    -1     }
  384    -1 }
  385    -1 
  386    -1 @media all and (max-width: 730px) {
  387    -1     .body, .footer .inner {
  388    -1         width: $narrow_site_width;
  389    -1     }
  390    -1 
  391    -1     .header h1 {
  392    -1         font-size: 52px;
  393    -1         padding-top: 100px;
  394    -1     }
  395    -1 
  396    -1     .nav .nav_social {
  397    -1         display: none;
  398    -1     }
  399    -1 
  400    -1     .example iframe {
  401    -1         width: $narrow_site_width - 8px;
  402    -1     }
  403    -1 
  404    -1     .long_example {
  405    -1         .highlight {
  406    -1             font-size: 15px;
  407    -1         }
  408    -1     }
  409    -1 
  410    -1 }
  411    -1 

diff --git a/site/site.moon b/site/site.moon

@@ -1,32 +0,0 @@
    1    -1 require "sitegen"
    2    -1 
    3    -1 tools = require"sitegen.tools"
    4    -1 
    5    -1 exec = (cmd) ->
    6    -1   f = io.popen(cmd)
    7    -1   with f\read "*a"
    8    -1     f\close!
    9    -1 
   10    -1 site = sitegen.create_site =>
   11    -1   @title = "Sticky-Kit | jQuery plugin for sticky elements"
   12    -1   @version = "1.1.1"
   13    -1 
   14    -1   @full_size = exec("du -bh www/src/jquery.sticky-kit.js | cut -f 1")\lower!
   15    -1   @compressed_size = exec("du -bh www/src/jquery.sticky-kit.min.js | cut -f 1")\lower!
   16    -1 
   17    -1   deploy_to "leaf@leafo.net", "www/sticky-kit"
   18    -1 
   19    -1   scssphp = tools.system_command "pscss < %s > %s", "css"
   20    -1   coffeescript = tools.system_command "coffee -c -s < %s > %s", "js"
   21    -1 
   22    -1   build scssphp, "main.scss"
   23    -1   build scssphp, "example.scss"
   24    -1 
   25    -1   build coffeescript, "main.coffee"
   26    -1   build coffeescript, "example.coffee"
   27    -1 
   28    -1   add "index.html"
   29    -1   add "examples/1.html", "examples/2.html", "examples/3.html",
   30    -1     "examples/4.html", template: "example"
   31    -1 
   32    -1 site\write!

diff --git a/site/templates/example.html b/site/templates/example.html

@@ -1,19 +0,0 @@
    1    -1 <!DOCTYPE HTML>
    2    -1 <html lang="en">
    3    -1 <head>
    4    -1   <meta charset="UTF-8">
    5    -1   <title>example</title>
    6    -1 
    7    -1   <link rel="stylesheet" href="$root/example.css" />
    8    -1 
    9    -1   <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
   10    -1   <script src="$root/src/jquery.sticky-kit.js"></script>
   11    -1   <script src="$root/example.js"></script>
   12    -1 
   13    -1 </head>
   14    -1 <body>
   15    -1 
   16    -1 $body
   17    -1 	
   18    -1 </body>
   19    -1 </html>

diff --git a/site/templates/index.html b/site/templates/index.html

@@ -1,61 +0,0 @@
    1    -1 <!DOCTYPE HTML>
    2    -1 <html lang="en">
    3    -1 <head>
    4    -1   <meta charset="UTF-8">
    5    -1   <title>$title</title>
    6    -1 
    7    -1   <link rel="stylesheet" href="$root/main.css" />
    8    -1   <link href='http://fonts.googleapis.com/css?family=Lato:400,900' rel='stylesheet' type='text/css'>
    9    -1   <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
   10    -1   <script type="text/javascript" src="$root/main.js"></script>
   11    -1   <script type="text/javascript" src="$root/src/jquery.sticky-kit.js"></script>
   12    -1   $analytics{"UA-136625-1"}
   13    -1 </head>
   14    -1 <body>
   15    -1 
   16    -1 <div class="body">
   17    -1 
   18    -1 <div class="header">
   19    -1   <div class="downloader">
   20    -1     <div class="download_label">Download v$version</div>
   21    -1     <div class="download_outer">
   22    -1       <a href="https://rawgithub.com/leafo/sticky-kit/v$version/jquery.sticky-kit.min.js" class="download_row top_row">
   23    -1         <span>Compressed</span>
   24    -1         <span class="size">$compressed_size</span>
   25    -1       </a>
   26    -1       <a href="https://rawgithub.com/leafo/sticky-kit/v$version/jquery.sticky-kit.js" class="download_row">
   27    -1         <span>Full Source</span>
   28    -1         <span class="size">$full_size</span>
   29    -1       </a>
   30    -1     </div>
   31    -1 
   32    -1     <div class="twitter_buttons">
   33    -1       <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://leafo.net/sticky-kit/" data-text="Sticky-kit v$version - A jQuery plugin for sticky elements" data-count="horizontal" data-via="moonscript">Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
   34    -1       <a href="https://twitter.com/moonscript" class="twitter-follow-button" data-width="70px" data-show-count="false" data-show-screen-name="false">Follow @moonscript</a>
   35    -1     </div>
   36    -1 
   37    -1   </div>
   38    -1   <h1>Sticky-Kit</h1>
   39    -1   <h2>A jQuery plugin for making smart sticky elements</h2>
   40    -1 </div>
   41    -1 
   42    -1 $body
   43    -1 
   44    -1 </div>
   45    -1 
   46    -1 <div class="footer">
   47    -1   <div class="inner">
   48    -1     <div>
   49    -1       created by <a href="http://leafo.net">leaf corcoran</a> &middot; sticky-kit is licensed under WTFPL
   50    -1     </div>
   51    -1     <div>
   52    -1       generated by <a href="http://github.com/leafo/sitegen">sitegen</a> on $generate_date
   53    -1     </div>
   54    -1   </div>
   55    -1 </div>
   56    -1 
   57    -1 
   58    -1 <a href="https://github.com/leafo/sticky-kit" class="forkme"><img style="position: fixed; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub"></a>
   59    -1 
   60    -1 </body>
   61    -1 </html>

diff --git a/site/www/.gitignore b/site/www/.gitignore

@@ -1,5 +0,0 @@
    1    -1 examples/1.html
    2    -1 examples/2.html
    3    -1 examples/3.html
    4    -1 examples/4.html
    5    -1 index.htm
    5    -1 
\ No newline at end of file

diff --git a/site/www/images/sticky_water.png b/site/www/images/sticky_water.png

Binary files differ.

diff --git a/site/www/src/jquery.sticky-kit.js b/site/www/src/jquery.sticky-kit.js

@@ -1,242 +0,0 @@
    1    -1 // Generated by CoffeeScript 1.7.1
    2    -1 
    3    -1 /**
    4    -1 @license Sticky-kit v1.1.1 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    5    -1  */
    6    -1 
    7    -1 (function() {
    8    -1   var $, win;
    9    -1 
   10    -1   $ = this.jQuery || window.jQuery;
   11    -1 
   12    -1   win = $(window);
   13    -1 
   14    -1   $.fn.stick_in_parent = function(opts) {
   15    -1     var elm, enable_bottoming, inner_scrolling, manual_spacer, offset_top, parent_selector, recalc_every, sticky_class, _fn, _i, _len;
   16    -1     if (opts == null) {
   17    -1       opts = {};
   18    -1     }
   19    -1     sticky_class = opts.sticky_class, inner_scrolling = opts.inner_scrolling, recalc_every = opts.recalc_every, parent_selector = opts.parent, offset_top = opts.offset_top, manual_spacer = opts.spacer, enable_bottoming = opts.bottoming;
   20    -1     if (offset_top == null) {
   21    -1       offset_top = 0;
   22    -1     }
   23    -1     if (parent_selector == null) {
   24    -1       parent_selector = void 0;
   25    -1     }
   26    -1     if (inner_scrolling == null) {
   27    -1       inner_scrolling = true;
   28    -1     }
   29    -1     if (sticky_class == null) {
   30    -1       sticky_class = "is_stuck";
   31    -1     }
   32    -1     if (enable_bottoming == null) {
   33    -1       enable_bottoming = true;
   34    -1     }
   35    -1     _fn = function(elm, padding_bottom, parent_top, parent_height, top, height, el_float, detached) {
   36    -1       var bottomed, detach, fixed, last_pos, offset, parent, recalc, recalc_and_tick, recalc_counter, spacer, tick;
   37    -1       if (elm.data("sticky_kit")) {
   38    -1         return;
   39    -1       }
   40    -1       elm.data("sticky_kit", true);
   41    -1       parent = elm.parent();
   42    -1       if (parent_selector != null) {
   43    -1         parent = parent.closest(parent_selector);
   44    -1       }
   45    -1       if (!parent.length) {
   46    -1         throw "failed to find stick parent";
   47    -1       }
   48    -1       fixed = false;
   49    -1       bottomed = false;
   50    -1       spacer = manual_spacer != null ? manual_spacer && elm.closest(manual_spacer) : $("<div />");
   51    -1       if (spacer) {
   52    -1         spacer.css('position', elm.css('position'));
   53    -1       }
   54    -1       recalc = function() {
   55    -1         var border_top, padding_top, restore;
   56    -1         if (detached) {
   57    -1           return;
   58    -1         }
   59    -1         border_top = parseInt(parent.css("border-top-width"), 10);
   60    -1         padding_top = parseInt(parent.css("padding-top"), 10);
   61    -1         padding_bottom = parseInt(parent.css("padding-bottom"), 10);
   62    -1         parent_top = parent.offset().top + border_top + padding_top;
   63    -1         parent_height = parent.height();
   64    -1         if (fixed) {
   65    -1           fixed = false;
   66    -1           bottomed = false;
   67    -1           if (manual_spacer == null) {
   68    -1             elm.insertAfter(spacer);
   69    -1             spacer.detach();
   70    -1           }
   71    -1           elm.css({
   72    -1             position: "",
   73    -1             top: "",
   74    -1             width: "",
   75    -1             bottom: ""
   76    -1           }).removeClass(sticky_class);
   77    -1           restore = true;
   78    -1         }
   79    -1         top = elm.offset().top - parseInt(elm.css("margin-top"), 10) - offset_top;
   80    -1         height = elm.outerHeight(true);
   81    -1         el_float = elm.css("float");
   82    -1         if (spacer) {
   83    -1           spacer.css({
   84    -1             width: elm.outerWidth(true),
   85    -1             height: height,
   86    -1             display: elm.css("display"),
   87    -1             "vertical-align": elm.css("vertical-align"),
   88    -1             "float": el_float
   89    -1           });
   90    -1         }
   91    -1         if (restore) {
   92    -1           return tick();
   93    -1         }
   94    -1       };
   95    -1       recalc();
   96    -1       if (height === parent_height) {
   97    -1         return;
   98    -1       }
   99    -1       last_pos = void 0;
  100    -1       offset = offset_top;
  101    -1       recalc_counter = recalc_every;
  102    -1       tick = function() {
  103    -1         var css, delta, scroll, will_bottom, win_height;
  104    -1         if (detached) {
  105    -1           return;
  106    -1         }
  107    -1         if (recalc_counter != null) {
  108    -1           recalc_counter -= 1;
  109    -1           if (recalc_counter <= 0) {
  110    -1             recalc_counter = recalc_every;
  111    -1             recalc();
  112    -1           }
  113    -1         }
  114    -1         scroll = win.scrollTop();
  115    -1         if (last_pos != null) {
  116    -1           delta = scroll - last_pos;
  117    -1         }
  118    -1         last_pos = scroll;
  119    -1         if (fixed) {
  120    -1           if (enable_bottoming) {
  121    -1             will_bottom = scroll + height + offset > parent_height + parent_top;
  122    -1             if (bottomed && !will_bottom) {
  123    -1               bottomed = false;
  124    -1               elm.css({
  125    -1                 position: "fixed",
  126    -1                 bottom: "",
  127    -1                 top: offset
  128    -1               }).trigger("sticky_kit:unbottom");
  129    -1             }
  130    -1           }
  131    -1           if (scroll < top) {
  132    -1             fixed = false;
  133    -1             offset = offset_top;
  134    -1             if (manual_spacer == null) {
  135    -1               if (el_float === "left" || el_float === "right") {
  136    -1                 elm.insertAfter(spacer);
  137    -1               }
  138    -1               spacer.detach();
  139    -1             }
  140    -1             css = {
  141    -1               position: "",
  142    -1               width: "",
  143    -1               top: ""
  144    -1             };
  145    -1             elm.css(css).removeClass(sticky_class).trigger("sticky_kit:unstick");
  146    -1           }
  147    -1           if (inner_scrolling) {
  148    -1             win_height = win.height();
  149    -1             if (height + offset_top > win_height) {
  150    -1               if (!bottomed) {
  151    -1                 offset -= delta;
  152    -1                 offset = Math.max(win_height - height, offset);
  153    -1                 offset = Math.min(offset_top, offset);
  154    -1                 if (fixed) {
  155    -1                   elm.css({
  156    -1                     top: offset + "px"
  157    -1                   });
  158    -1                 }
  159    -1               }
  160    -1             }
  161    -1           }
  162    -1         } else {
  163    -1           if (scroll > top) {
  164    -1             fixed = true;
  165    -1             css = {
  166    -1               position: "fixed",
  167    -1               top: offset
  168    -1             };
  169    -1             css.width = elm.css("box-sizing") === "border-box" ? elm.outerWidth() + "px" : elm.width() + "px";
  170    -1             elm.css(css).addClass(sticky_class);
  171    -1             if (manual_spacer == null) {
  172    -1               elm.after(spacer);
  173    -1               if (el_float === "left" || el_float === "right") {
  174    -1                 spacer.append(elm);
  175    -1               }
  176    -1             }
  177    -1             elm.trigger("sticky_kit:stick");
  178    -1           }
  179    -1         }
  180    -1         if (fixed && enable_bottoming) {
  181    -1           if (will_bottom == null) {
  182    -1             will_bottom = scroll + height + offset > parent_height + parent_top;
  183    -1           }
  184    -1           if (!bottomed && will_bottom) {
  185    -1             bottomed = true;
  186    -1             if (parent.css("position") === "static") {
  187    -1               parent.css({
  188    -1                 position: "relative"
  189    -1               });
  190    -1             }
  191    -1             return elm.css({
  192    -1               position: "absolute",
  193    -1               bottom: padding_bottom,
  194    -1               top: "auto"
  195    -1             }).trigger("sticky_kit:bottom");
  196    -1           }
  197    -1         }
  198    -1       };
  199    -1       recalc_and_tick = function() {
  200    -1         recalc();
  201    -1         return tick();
  202    -1       };
  203    -1       detach = function() {
  204    -1         detached = true;
  205    -1         win.off("touchmove", tick);
  206    -1         win.off("scroll", tick);
  207    -1         win.off("resize", recalc_and_tick);
  208    -1         $(document.body).off("sticky_kit:recalc", recalc_and_tick);
  209    -1         elm.off("sticky_kit:detach", detach);
  210    -1         elm.removeData("sticky_kit");
  211    -1         elm.css({
  212    -1           position: "",
  213    -1           bottom: "",
  214    -1           top: "",
  215    -1           width: ""
  216    -1         });
  217    -1         parent.position("position", "");
  218    -1         if (fixed) {
  219    -1           if (manual_spacer == null) {
  220    -1             if (el_float === "left" || el_float === "right") {
  221    -1               elm.insertAfter(spacer);
  222    -1             }
  223    -1             spacer.remove();
  224    -1           }
  225    -1           return elm.removeClass(sticky_class);
  226    -1         }
  227    -1       };
  228    -1       win.on("touchmove", tick);
  229    -1       win.on("scroll", tick);
  230    -1       win.on("resize", recalc_and_tick);
  231    -1       $(document.body).on("sticky_kit:recalc", recalc_and_tick);
  232    -1       elm.on("sticky_kit:detach", detach);
  233    -1       return setTimeout(tick, 0);
  234    -1     };
  235    -1     for (_i = 0, _len = this.length; _i < _len; _i++) {
  236    -1       elm = this[_i];
  237    -1       _fn($(elm));
  238    -1     }
  239    -1     return this;
  240    -1   };
  241    -1 
  242    -1 }).call(this);

diff --git a/site/www/src/jquery.sticky-kit.min.js b/site/www/src/jquery.sticky-kit.min.js

@@ -1,9 +0,0 @@
    1    -1 /*
    2    -1  Sticky-kit v1.1.1 | WTFPL | Leaf Corcoran 2014 | http://leafo.net
    3    -1 */
    4    -1 (function(){var k,e;k=this.jQuery||window.jQuery;e=k(window);k.fn.stick_in_parent=function(d){var v,y,n,p,h,C,s,G,q,H;null==d&&(d={});s=d.sticky_class;y=d.inner_scrolling;C=d.recalc_every;h=d.parent;p=d.offset_top;n=d.spacer;v=d.bottoming;null==p&&(p=0);null==h&&(h=void 0);null==y&&(y=!0);null==s&&(s="is_stuck");null==v&&(v=!0);G=function(a,d,q,z,D,t,r,E){var u,F,m,A,c,f,B,w,x,g,b;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);f=a.parent();null!=h&&(f=f.closest(h));if(!f.length)throw"failed to find stick parent";
    5    -1 u=m=!1;(g=null!=n?n&&a.closest(n):k("<div />"))&&g.css("position",a.css("position"));B=function(){var c,e,l;if(!E&&(c=parseInt(f.css("border-top-width"),10),e=parseInt(f.css("padding-top"),10),d=parseInt(f.css("padding-bottom"),10),q=f.offset().top+c+e,z=f.height(),m&&(u=m=!1,null==n&&(a.insertAfter(g),g.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(s),l=!0),D=a.offset().top-parseInt(a.css("margin-top"),10)-p,t=a.outerHeight(!0),r=a.css("float"),g&&g.css({width:a.outerWidth(!0),
    6    -1 height:t,display:a.css("display"),"vertical-align":a.css("vertical-align"),"float":r}),l))return b()};B();if(t!==z)return A=void 0,c=p,x=C,b=function(){var b,k,l,h;if(!E&&(null!=x&&(--x,0>=x&&(x=C,B())),l=e.scrollTop(),null!=A&&(k=l-A),A=l,m?(v&&(h=l+t+c>z+q,u&&!h&&(u=!1,a.css({position:"fixed",bottom:"",top:c}).trigger("sticky_kit:unbottom"))),l<D&&(m=!1,c=p,null==n&&("left"!==r&&"right"!==r||a.insertAfter(g),g.detach()),b={position:"",width:"",top:""},a.css(b).removeClass(s).trigger("sticky_kit:unstick")),
    7    -1 y&&(b=e.height(),t+p>b&&!u&&(c-=k,c=Math.max(b-t,c),c=Math.min(p,c),m&&a.css({top:c+"px"})))):l>D&&(m=!0,b={position:"fixed",top:c},b.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(b).addClass(s),null==n&&(a.after(g),"left"!==r&&"right"!==r||g.append(a)),a.trigger("sticky_kit:stick")),m&&v&&(null==h&&(h=l+t+c>z+q),!u&&h)))return u=!0,"static"===f.css("position")&&f.css({position:"relative"}),a.css({position:"absolute",bottom:d,top:"auto"}).trigger("sticky_kit:bottom")},
    8    -1 w=function(){B();return b()},F=function(){E=!0;e.off("touchmove",b);e.off("scroll",b);e.off("resize",w);k(document.body).off("sticky_kit:recalc",w);a.off("sticky_kit:detach",F);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:"",width:""});f.position("position","");if(m)return null==n&&("left"!==r&&"right"!==r||a.insertAfter(g),g.remove()),a.removeClass(s)},e.on("touchmove",b),e.on("scroll",b),e.on("resize",w),k(document.body).on("sticky_kit:recalc",w),a.on("sticky_kit:detach",F),setTimeout(b,
    9    -1 0)}};q=0;for(H=this.length;q<H;q++)d=this[q],G(k(d));return this}}).call(this);