close #23 navigation oprions

Updated demo
orion3dgames · Jun 9, 2015 · 2e6e80d · 2e6e80d
1 parent f73d127
commit 2e6e80d
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 13 deletions.
diff --git a/README.md b/README.md
@@ -76,9 +76,13 @@ Live demo GRIDDER v2 : http://www.oriongunning.com/demo/gridder-ajax/demo.php
         $('.gridder').gridderExpander({
             scroll: true,
             scrollOffset: 30,
-            scrollTo: "panel", // panel or listitem
+            scrollTo: "panel",                  // panel or listitem
             animationSpeed: 400,
             animationEasing: "easeInOutExpo",
+            showNav: true,                      // Show Navigation
+            nextText: "Next",                   // Next button text
+            prevText: "Previous",               // Previous button text
+            closeText: "Close",                 // Close button text
             onStart: function(){
                 console.log("Gridder Inititialized");
             },

diff --git a/demo/demo.php b/demo/demo.php
@@ -19,7 +19,7 @@
 		</div>
 
 		<div class="container">
-			
+
 			<ul class="gridder">
 				<?php for ($i = 0; $i < 14; $i++): ?>
 					<li class="gridder-list" data-griddercontent="#gridder-content-<?php echo $i; ?>">
@@ -86,6 +86,10 @@
                     scrollTo: "panel", // "panel" or "listitem"
                     animationSpeed: 400,
                     animationEasing: "easeInOutExpo",
+					showNav: true,
+					nextText: "Next",
+					prevText: "Previous",
+					closeText: "Close",
                     onStart: function () {
                         console.log("Gridder Inititialized");
                     },

diff --git a/dist/js/jquery.gridder.js b/dist/js/jquery.gridder.js
@@ -109,11 +109,13 @@
                 /* EXPANDED OUTPUT */
                 var currentcontent = $(myself.data("griddercontent")).html();
                 var htmlcontent = "<div class=\"gridder-padding\">";
-                htmlcontent += "<div class=\"gridder-navigation\">";
-                htmlcontent += "<a href=\"#\" class=\"gridder-close\"><i class=\"fa fa-angle-right\" style=\"position: relative; left: 3px\"></i><i class=\"fa fa-angle-left\"></i></a>";
-                htmlcontent += "<a href=\"#\" class=\"gridder-nav prev\"><i class=\"fa fa-angle-left\"></i></a>";
-                htmlcontent += "<a href=\"#\" class=\"gridder-nav next\"><i class=\"fa fa-angle-right\"></i></a>";
-                htmlcontent += "</div>";
+                if(settings.showNav){
+                    htmlcontent += "<div class=\"gridder-navigation\">";
+                    htmlcontent += "<a href=\"#\" class=\"gridder-close\">"+settings.closeText+"</a>";
+                    htmlcontent += "<a href=\"#\" class=\"gridder-nav prev\">"+settings.prevText+"</a>";
+                    htmlcontent += "<a href=\"#\" class=\"gridder-nav next\">"+settings.nextText+"</a>";
+                    htmlcontent += "</div>";
+                }            
                 htmlcontent += "<div class=\"gridder-expanded-content\">";
                 htmlcontent += currentcontent;
                 htmlcontent += "</div>";
@@ -180,6 +182,10 @@
         scrollTo: "panel", // panel or listitem
         animationSpeed: 400,
         animationEasing: "easeInOutExpo",
+        showNav: true,
+        nextText: "Next",
+        prevText: "Previous",
+        closeText: "Close",
         onStart: function(){
             console.log("Gridder Inititialized");
         },

diff --git a/dist/js/jquery.gridder.min.js b/dist/js/jquery.gridder.min.js
diff --git a/src/jquery.gridder.js b/src/jquery.gridder.js
@@ -101,11 +101,13 @@
                 /* EXPANDED OUTPUT */
                 var currentcontent = $(myself.data("griddercontent")).html();
                 var htmlcontent = "<div class=\"gridder-padding\">";
-                htmlcontent += "<div class=\"gridder-navigation\">";
-                htmlcontent += "<a href=\"#\" class=\"gridder-close\"><i class=\"fa fa-angle-right\" style=\"position: relative; left: 3px\"></i><i class=\"fa fa-angle-left\"></i></a>";
-                htmlcontent += "<a href=\"#\" class=\"gridder-nav prev\"><i class=\"fa fa-angle-left\"></i></a>";
-                htmlcontent += "<a href=\"#\" class=\"gridder-nav next\"><i class=\"fa fa-angle-right\"></i></a>";
-                htmlcontent += "</div>";
+                if(settings.showNav){
+                    htmlcontent += "<div class=\"gridder-navigation\">";
+                    htmlcontent += "<a href=\"#\" class=\"gridder-close\">"+settings.closeText+"</a>";
+                    htmlcontent += "<a href=\"#\" class=\"gridder-nav prev\">"+settings.prevText+"</a>";
+                    htmlcontent += "<a href=\"#\" class=\"gridder-nav next\">"+settings.nextText+"</a>";
+                    htmlcontent += "</div>";
+                }            
                 htmlcontent += "<div class=\"gridder-expanded-content\">";
                 htmlcontent += currentcontent;
                 htmlcontent += "</div>";
@@ -172,6 +174,10 @@
         scrollTo: "panel", // panel or listitem
         animationSpeed: 400,
         animationEasing: "easeInOutExpo",
+        showNav: true,
+        nextText: "Next",
+        prevText: "Previous",
+        closeText: "Close",
         onStart: function(){
             console.log("Gridder Inititialized");
         },