From 313f62d2f803499a748358b69da91b2413bdee7a Mon Sep 17 00:00:00 2001
From: DanielApt <daniel@knowsis.com>
Date: Wed, 18 Feb 2015 16:36:10 +0000
Subject: [PATCH] Update examples to use no-js fallback of overflow: scroll

---
 examples/always-visible.html                  | 2 +-
 examples/jquery.html                          | 2 +-
 examples/options-default.html                 | 2 +-
 examples/options-minScrollbarLength.html      | 2 +-
 examples/options-suppressScrollAxis.html      | 2 +-
 examples/options-useBothWheelAxes.html        | 2 +-
 examples/options-wheelPropagation.html        | 2 +-
 examples/options-wheelSpeed.html              | 2 +-
 examples/reach-the-end-callback.html          | 2 +-
 examples/removable-list-element.html          | 2 +-
 examples/rtl.html                             | 2 +-
 examples/scrollbars-on-the-opposite-side.html | 2 +-
 examples/scrollbars-with-margin.html          | 2 +-
 examples/table-content.html                   | 3 ++-
 examples/text-content.html                    | 2 +-
 15 files changed, 16 insertions(+), 15 deletions(-)

diff --git a/examples/always-visible.html b/examples/always-visible.html
index 0142fca..5bd5ccd 100644
--- a/examples/always-visible.html
+++ b/examples/always-visible.html
@@ -7,7 +7,7 @@
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
       h1 { text-align: center; }
-      .container { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .container { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .container .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
     </style>
     <style>
diff --git a/examples/jquery.html b/examples/jquery.html
index 3badd6a..67bda00 100644
--- a/examples/jquery.html
+++ b/examples/jquery.html
@@ -7,7 +7,7 @@
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
     <script src="../dist/js/perfect-scrollbar.jquery.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
     </style>
diff --git a/examples/options-default.html b/examples/options-default.html
index fb0e679..b1ce17d 100644
--- a/examples/options-default.html
+++ b/examples/options-default.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
     </style>
diff --git a/examples/options-minScrollbarLength.html b/examples/options-minScrollbarLength.html
index 6cf2861..f6649db 100644
--- a/examples/options-minScrollbarLength.html
+++ b/examples/options-minScrollbarLength.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 12800px; height: 7200px; }
       .spacer { text-align:center }
     </style>
diff --git a/examples/options-suppressScrollAxis.html b/examples/options-suppressScrollAxis.html
index 4d1378f..ef1656e 100644
--- a/examples/options-suppressScrollAxis.html
+++ b/examples/options-suppressScrollAxis.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
       h2 { text-align: center; }
diff --git a/examples/options-useBothWheelAxes.html b/examples/options-useBothWheelAxes.html
index 46e1d37..6a96048 100644
--- a/examples/options-useBothWheelAxes.html
+++ b/examples/options-useBothWheelAxes.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: scroll; }
       .contentHolder .content-x { background-image: url('./azusa.jpg'); width: 1920px; height: 360px; }
       .contentHolder .content-y { background-image: url('./azusa.jpg'); width: 640px; height: 1080px; }
       .spacer { text-align:center; }
diff --git a/examples/options-wheelPropagation.html b/examples/options-wheelPropagation.html
index 3326791..62bba20 100644
--- a/examples/options-wheelPropagation.html
+++ b/examples/options-wheelPropagation.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
     </style>
diff --git a/examples/options-wheelSpeed.html b/examples/options-wheelSpeed.html
index 6e1230c..0b8bd67 100644
--- a/examples/options-wheelSpeed.html
+++ b/examples/options-wheelSpeed.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
     </style>
diff --git a/examples/reach-the-end-callback.html b/examples/reach-the-end-callback.html
index 124a1e0..9f8f812 100644
--- a/examples/reach-the-end-callback.html
+++ b/examples/reach-the-end-callback.html
@@ -10,7 +10,7 @@
         border: 1px solid gray;
         height:150px;
         width: 400px;
-        overflow: hidden;
+        overflow: scroll;
         position: relative;
       }
       #status { color: red; }
diff --git a/examples/removable-list-element.html b/examples/removable-list-element.html
index d034757..2526c44 100644
--- a/examples/removable-list-element.html
+++ b/examples/removable-list-element.html
@@ -10,7 +10,7 @@
         border: 1px solid gray;
         max-height: 300px;
         width: 400px;
-        overflow: hidden;
+        overflow: scroll;
         position: relative;
       }
       #test .element {
diff --git a/examples/rtl.html b/examples/rtl.html
index d774fce..d15d26a 100644
--- a/examples/rtl.html
+++ b/examples/rtl.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
 
diff --git a/examples/scrollbars-on-the-opposite-side.html b/examples/scrollbars-on-the-opposite-side.html
index b2083db..de1c877 100644
--- a/examples/scrollbars-on-the-opposite-side.html
+++ b/examples/scrollbars-on-the-opposite-side.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
 
diff --git a/examples/scrollbars-with-margin.html b/examples/scrollbars-with-margin.html
index cc8f692..7a4972f 100644
--- a/examples/scrollbars-with-margin.html
+++ b/examples/scrollbars-with-margin.html
@@ -6,7 +6,7 @@
     <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
     <script src="../dist/js/perfect-scrollbar.js"></script>
     <style>
-      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: hidden; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: scroll; }
       .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
       .spacer { text-align:center }
 
diff --git a/examples/table-content.html b/examples/table-content.html
index eea3c1f..f817942 100644
--- a/examples/table-content.html
+++ b/examples/table-content.html
@@ -17,7 +17,8 @@
       }
       #table tbody {
         height: 100px;
-        overflow-y: hidden;
+        overflow-y: scroll;
+        overflow-x:hidden;
         position: relative;
       }
       #table tbody td, #table thead th {
diff --git a/examples/text-content.html b/examples/text-content.html
index 9f13042..7f9282a 100644
--- a/examples/text-content.html
+++ b/examples/text-content.html
@@ -10,7 +10,7 @@
         border: 1px solid gray;
         height:150px;
         width: 400px;
-        overflow: hidden;
+        overflow: scroll;
         position: relative;
       }
     </style>