From 9ca1539ab40c51a0394f8b1c92a3fc952250f7c7 Mon Sep 17 00:00:00 2001
From: DanielApt <daniel@knowsis.com>
Date: Sat, 21 Feb 2015 12:53:42 +0000
Subject: [PATCH] Use overflow:auto instead of scroll

---
 examples/always-visible.html                  | 2 +-
 examples/iframe-content.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                   | 2 +-
 examples/text-content.html                    | 2 +-
 16 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/examples/always-visible.html b/examples/always-visible.html
index 5bd5ccd..4c4b757 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: scroll; }
+      .container { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .container .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
     </style>
     <style>
diff --git a/examples/iframe-content.html b/examples/iframe-content.html
index 3b6ff21..c2e8950 100644
--- a/examples/iframe-content.html
+++ b/examples/iframe-content.html
@@ -5,7 +5,7 @@
     <title>perfect-scrollbar example</title>
       <link href="../dist/css/perfect-scrollbar.css" rel="stylesheet">
       <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;}
         .contentHolder .content { background-image: url('./azusa.jpg'); width: 1280px; height: 720px; }
         .spacer { text-align:center }
       </style>
diff --git a/examples/jquery.html b/examples/jquery.html
index 67bda00..afdfae5 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 b1ce17d..3cf6bf2 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 f6649db..88e782e 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: auto; }
       .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 ef1656e..0bc1a02 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 6a96048..a786ebc 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 640px; height: 360px; overflow: auto; }
       .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 62bba20..6997bd8 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 0b8bd67..b1f9b1d 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 9f8f812..1dcc702 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: scroll;
+        overflow: auto;
         position: relative;
       }
       #status { color: red; }
diff --git a/examples/removable-list-element.html b/examples/removable-list-element.html
index 2526c44..4db76f0 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: scroll;
+        overflow: auto;
         position: relative;
       }
       #test .element {
diff --git a/examples/rtl.html b/examples/rtl.html
index d15d26a..b236166 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 de1c877..453e23d 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 7a4972f..df50767 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: scroll; }
+      .contentHolder { position:relative; margin:0px auto; padding:0px; width: 600px; height: 400px; overflow: auto; }
       .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 f817942..ca04a8b 100644
--- a/examples/table-content.html
+++ b/examples/table-content.html
@@ -17,7 +17,7 @@
       }
       #table tbody {
         height: 100px;
-        overflow-y: scroll;
+        overflow-y: auto;
         overflow-x:hidden;
         position: relative;
       }
diff --git a/examples/text-content.html b/examples/text-content.html
index 7f9282a..3fe192c 100644
--- a/examples/text-content.html
+++ b/examples/text-content.html
@@ -10,7 +10,7 @@
         border: 1px solid gray;
         height:150px;
         width: 400px;
-        overflow: scroll;
+        overflow: auto;
         position: relative;
       }
     </style>