LukyVj#61 updated demo.

Author: jolidog

source/javascripts/demo.js

@@ -211,20 +211,31 @@ document.getElementById('all-but').addEventListener('keyup', function(){
 // each
 ///////////////////////////////
 
-function each(num) {
-	function injectStyle(num){
+function each(numa, numb) {
+	function injectStyle(numa, numb){
 		document.getElementById('style-each').innerHTML = `ul.each li { ${preStyle} }`;
-		document.getElementById('style-each').innerHTML += `.each li:nth-child(${num}n){
-			${selectedStyle}
+
+		if (numb == 0) {
+  		document.getElementById('style-each').innerHTML += `.each li:nth-child(${numa}n){
+  			${selectedStyle}
+  		}
+  		`
+		}
+		else {
+  		document.getElementById('style-each').innerHTML += `.each li:nth-child(${numa}n + ${numb}){
+  			${selectedStyle}
+  		}
+  		`
 		}
-		`
 	}
 
-	var newStyle = injectStyle(num);
+	var newStyle = injectStyle(numa, numb);
 
 }
 document.getElementById('each').addEventListener('keyup', function(){
-	each(this.innerHTML)
+	var vala = document.getElementById('each-every').innerHTML;
+	var valb = document.getElementById('each-from').innerHTML;
+	each(vala, valb)
 })
 
 ///////////////////////////////

source/layouts/partials/_demo.html.haml

@@ -157,7 +157,7 @@
             :preserve
               <span class="param">@include</span> n-between(<span class="num" contenteditable id="n-between-a">3</span>,<span class="num" contenteditable id="n-between-b">3</span>,<span class="num" contenteditable id="n-between-c">13</span>)
               <span class="comment"> // This mixin uses 3 arguments, the first one is equal to N item,
-               // the second is the starting item and the thirs the end item.  </span>
+               // the second is the starting item and the third the end item.  </span>
 
         %ul.n-between
           %li 1
@@ -200,9 +200,11 @@
         %header
           %h3 each
         %pre
-          %code
+          %code#each
             :preserve
-              <span class="param"> @include</span> each(<span class="num" contenteditable id="each">3</span>)
+              <span class="param"> @include</span> each(<span class="num" contenteditable id="each-every">3</span>,<span class="num" contenteditable id="each-from">0</span>)
+              <span class="comment"> // This mixin uses 2 arguments, the first one is equal to N item,
+               // the second is the starting item and can be omitted, the default value is 0.  </span>
 
               <span class="comment"> // Alias of each()</span>
               <span class="param"> @include</span> every(<span class="num" contenteditable id="each">3</span>)