Release 0.5.4

1. Inner scrollbar problem fix.
2. Inner scrollbar touch event problem fix.
3. Bug fixes.

README.md

@@ -186,11 +186,9 @@ For IE problems, please refer to [IE Support](https://github.com/noraesae/perfec
 IE Support
 ----------
 
-This plugin supports old IE browsers in the **minimum** range. The plugin is tested in IEs >= IE6 and works(not well, but works).
+The plugin would work in IEs >= IE9(not well, though).
 
-**But the project will not accept the patches to fix IE problems in IE 6/7/8.**
-
-From jQuery 2.0, jQuery also will not support IE 6/7/8. I also think that supporting old browsers really breaks the web development conventions.
+**The patches to fix problems in IE<=8 won't be accepted.**
 
 When old IEs should be supported, please fork the project and make patches personally.
 

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "perfect-scrollbar",
-  "version": "0.5.3",
+  "version": "0.5.4",
   "homepage": "http://noraesae.github.io/perfect-scrollbar/",
   "authors": [
     "Hyunje Alex Jun <me@noraesae.net>"

min/perfect-scrollbar.min.css

@@ -1,5 +1,5 @@
-/*! perfect-scrollbar - v0.5.3
+/*! perfect-scrollbar - v0.5.4
 * http://noraesae.github.com/perfect-scrollbar/
 * Copyright (c) 2014 Hyunje Alex Jun; Licensed MIT */
 
-.ps-container .ps-scrollbar-x-rail{position:absolute;bottom:3px;height:8px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;opacity:0;filter:alpha(opacity=0);-o-transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;-moz-transition:background-color .2s linear,opacity .2s linear;transition:background-color .2s linear,opacity .2s linear}.ps-container:hover .ps-scrollbar-x-rail,.ps-container.hover .ps-scrollbar-x-rail{opacity:.6;filter:alpha(opacity=60)}.ps-container .ps-scrollbar-x-rail:hover,.ps-container .ps-scrollbar-x-rail.hover{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container .ps-scrollbar-x-rail.in-scrolling{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container .ps-scrollbar-y-rail{position:absolute;right:3px;width:8px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;opacity:0;filter:alpha(opacity=0);-o-transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;-moz-transition:background-color .2s linear,opacity .2s linear;transition:background-color .2s linear,opacity .2s linear}.ps-container:hover .ps-scrollbar-y-rail,.ps-container.hover .ps-scrollbar-y-rail{opacity:.6;filter:alpha(opacity=60)}.ps-container .ps-scrollbar-y-rail:hover,.ps-container .ps-scrollbar-y-rail.hover{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container .ps-scrollbar-y-rail.in-scrolling{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container .ps-scrollbar-x{position:absolute;bottom:0;height:8px;background-color:#aaa;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-o-transition:background-color .2s linear;-webkit-transition:background-color.2s linear;-moz-transition:background-color .2s linear;transition:background-color .2s linear}.ps-container .ps-scrollbar-x-rail:hover .ps-scrollbar-x,.ps-container .ps-scrollbar-x-rail.hover .ps-scrollbar-x{background-color:#999}.ps-container .ps-scrollbar-y{position:absolute;right:0;width:8px;background-color:#aaa;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-o-transition:background-color .2s linear;-webkit-transition:background-color.2s linear;-moz-transition:background-color .2s linear;transition:background-color .2s linear}.ps-container .ps-scrollbar-y-rail:hover .ps-scrollbar-y,.ps-container .ps-scrollbar-y-rail.hover .ps-scrollbar-y{background-color:#999}
+.ps-container>.ps-scrollbar-x-rail{position:absolute;bottom:3px;height:8px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;opacity:0;filter:alpha(opacity=0);-o-transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;-moz-transition:background-color .2s linear,opacity .2s linear;transition:background-color .2s linear,opacity .2s linear}.ps-container:hover>.ps-scrollbar-x-rail{opacity:.6;filter:alpha(opacity=60)}.ps-container>.ps-scrollbar-x-rail:hover{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container>.ps-scrollbar-x-rail.in-scrolling{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container>.ps-scrollbar-y-rail{position:absolute;right:3px;width:8px;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;opacity:0;filter:alpha(opacity=0);-o-transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;-moz-transition:background-color .2s linear,opacity .2s linear;transition:background-color .2s linear,opacity .2s linear}.ps-container:hover>.ps-scrollbar-y-rail{opacity:.6;filter:alpha(opacity=60)}.ps-container>.ps-scrollbar-y-rail:hover{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container>.ps-scrollbar-y-rail.in-scrolling{background-color:#eee;opacity:.9;filter:alpha(opacity=90)}.ps-container>.ps-scrollbar-x-rail>.ps-scrollbar-x{position:absolute;bottom:0;height:8px;background-color:#aaa;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-o-transition:background-color .2s linear;-webkit-transition:background-color.2s linear;-moz-transition:background-color .2s linear;transition:background-color .2s linear}.ps-container>.ps-scrollbar-x-rail:hover>.ps-scrollbar-x{background-color:#999}.ps-container>.ps-scrollbar-y-rail>.ps-scrollbar-y{position:absolute;right:0;width:8px;background-color:#aaa;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-o-transition:background-color .2s linear;-webkit-transition:background-color.2s linear;-moz-transition:background-color .2s linear;transition:background-color .2s linear}.ps-container>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y{background-color:#999}

package.json

@@ -1,7 +1,25 @@
 {
   "name": "perfect-scrollbar",
-  "version": "0.5.3",
+  "version": "0.5.4",
+  "description": "Tiny but perfect jquery scrollbar plugin.",
+  "author": "Hyunje Alex Jun <me@noraesae.net>",
+  "contributors": [{
+    "name": "Hyunje Alex Jun",
+    "email": "me@noraesae.net"
+  }],
   "main": "src/perfect-scrollbar.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/noraesae/perfect-scrollbar"
+  },
+  "bugs": {
+    "url": "https://github.com/noraesae/perfect-scrollbar/issues"
+  },
+  "keywords": [
+    "jquery-plugin",
+    "scroll",
+    "scrollbar"
+  ],
   "engines": {
     "node": ">= 0.8.0"
   },
@@ -16,5 +34,6 @@
   },
   "scripts": {
     "test": "grunt travis --verbose"
-  }
+  },
+  "license": "MIT"
 }

perfect-scrollbar.jquery.json

@@ -2,7 +2,7 @@
   "name": "perfect-scrollbar",
   "title": "perfect-scrollbar",
   "description": "Tiny but perfect jquery scrollbar plugin.",
-  "version": "0.5.3",
+  "version": "0.5.4",
   "author": {
     "name": "Hyunje Alex Jun",
     "email": "me@noraesae.net",

src/perfect-scrollbar.css

@@ -1,4 +1,4 @@
-.ps-container .ps-scrollbar-x-rail {
+.ps-container>.ps-scrollbar-x-rail {
     position: absolute; /* please don't change 'position' */
     bottom: 3px; /* there must be 'bottom' for ps-scrollbar-x-rail */
     height: 8px;
@@ -13,26 +13,24 @@
     transition: background-color .2s linear, opacity .2s linear;
 }
 
-.ps-container:hover .ps-scrollbar-x-rail,
-.ps-container.hover .ps-scrollbar-x-rail {
+.ps-container:hover>.ps-scrollbar-x-rail {
     opacity: 0.6;
     filter: alpha(opacity=60);
 }
 
-.ps-container .ps-scrollbar-x-rail:hover,
-.ps-container .ps-scrollbar-x-rail.hover {
+.ps-container>.ps-scrollbar-x-rail:hover {
     background-color: #eee;
     opacity: 0.9;
     filter: alpha(opacity=90);
 }
 
-.ps-container .ps-scrollbar-x-rail.in-scrolling {
+.ps-container>.ps-scrollbar-x-rail.in-scrolling {
     background-color: #eee;
     opacity: 0.9;
     filter: alpha(opacity=90);
 }
 
-.ps-container .ps-scrollbar-y-rail {
+.ps-container>.ps-scrollbar-y-rail {
     position: absolute; /* please don't change 'position' */
     right: 3px; /* there must be 'right' for ps-scrollbar-y-rail */
     width: 8px;
@@ -47,26 +45,24 @@
     transition: background-color .2s linear, opacity .2s linear;
 }
 
-.ps-container:hover .ps-scrollbar-y-rail,
-.ps-container.hover .ps-scrollbar-y-rail {
+.ps-container:hover>.ps-scrollbar-y-rail {
     opacity: 0.6;
     filter: alpha(opacity=60);
 }
 
-.ps-container .ps-scrollbar-y-rail:hover,
-.ps-container .ps-scrollbar-y-rail.hover {
+.ps-container>.ps-scrollbar-y-rail:hover {
     background-color: #eee;
     opacity: 0.9;
     filter: alpha(opacity=90);
 }
 
-.ps-container .ps-scrollbar-y-rail.in-scrolling {
+.ps-container>.ps-scrollbar-y-rail.in-scrolling {
     background-color: #eee;
     opacity: 0.9;
     filter: alpha(opacity=90);
 }
 
-.ps-container .ps-scrollbar-x {
+.ps-container>.ps-scrollbar-x-rail>.ps-scrollbar-x {
     position: absolute; /* please don't change 'position' */
     bottom: 0; /* there must be 'bottom' for ps-scrollbar-x */
     height: 8px;
@@ -80,12 +76,11 @@
     transition: background-color .2s linear;
 }
 
-.ps-container .ps-scrollbar-x-rail:hover .ps-scrollbar-x,
-.ps-container .ps-scrollbar-x-rail.hover .ps-scrollbar-x {
+.ps-container>.ps-scrollbar-x-rail:hover>.ps-scrollbar-x {
     background-color: #999;
 }
 
-.ps-container .ps-scrollbar-y {
+.ps-container>.ps-scrollbar-y-rail>.ps-scrollbar-y {
     position: absolute; /* please don't change 'position' */
     right: 0; /* there must be 'right' for ps-scrollbar-y */
     width: 8px;
@@ -99,7 +94,6 @@
     transition: background-color .2s linear;
 }
 
-.ps-container .ps-scrollbar-y-rail:hover .ps-scrollbar-y,
-.ps-container .ps-scrollbar-y-rail.hover .ps-scrollbar-y {
+.ps-container>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y {
     background-color: #999;
 }

src/perfect-scrollbar.js

@@ -531,7 +531,7 @@
         });
       }
 
-      function bindTouchHandler() {
+      function bindTouchHandler(supportsTouch, supportsIePointer) {
         function applyTouchMove(differenceX, differenceY) {
           $this.scrollTop($this.scrollTop() - differenceY);
           $this.scrollLeft($this.scrollLeft() - differenceX);
@@ -573,6 +573,7 @@
           }
 
           e.stopPropagation();
+          e.preventDefault();
         }
         function touchMove(e) {
           if (!inGlobalTouch && e.originalEvent.targetTouches.length === 1) {
@@ -595,6 +596,7 @@
               startTime = currentTime;
             }
 
+            e.stopPropagation();
             e.preventDefault();
           }
         }
@@ -613,24 +615,28 @@
           }, 10);
         }
 
-        $(window).bind("touchstart" + eventClassName, globalTouchStart);
-        $(window).bind("touchend" + eventClassName, globalTouchEnd);
-        $this.bind("touchstart" + eventClassName, touchStart);
-        $this.bind("touchmove" + eventClassName, touchMove);
-        $this.bind("touchend" + eventClassName, touchEnd);
+        if (supportsTouch) {
+          $(window).bind("touchstart" + eventClassName, globalTouchStart);
+          $(window).bind("touchend" + eventClassName, globalTouchEnd);
+          $this.bind("touchstart" + eventClassName, touchStart);
+          $this.bind("touchmove" + eventClassName, touchMove);
+          $this.bind("touchend" + eventClassName, touchEnd);
+        }
 
-        if (window.PointerEvent) {
-          $(window).bind("pointerdown" + eventClassName, globalTouchStart);
-          $(window).bind("pointerup" + eventClassName, globalTouchEnd);
-          $this.bind("pointerdown" + eventClassName, touchStart);
-          $this.bind("pointermove" + eventClassName, touchMove);
-          $this.bind("pointerup" + eventClassName, touchEnd);
-        } else if (window.MSPointerEvent) {
-          $(window).bind("MSPointerDown" + eventClassName, globalTouchStart);
-          $(window).bind("MSPointerUp" + eventClassName, globalTouchEnd);
-          $this.bind("MSPointerDown" + eventClassName, touchStart);
-          $this.bind("MSPointerMove" + eventClassName, touchMove);
-          $this.bind("MSPointerUp" + eventClassName, touchEnd);
+        if (supportsIePointer) {
+          if (window.PointerEvent) {
+            $(window).bind("pointerdown" + eventClassName, globalTouchStart);
+            $(window).bind("pointerup" + eventClassName, globalTouchEnd);
+            $this.bind("pointerdown" + eventClassName, touchStart);
+            $this.bind("pointermove" + eventClassName, touchMove);
+            $this.bind("pointerup" + eventClassName, touchEnd);
+          } else if (window.MSPointerEvent) {
+            $(window).bind("MSPointerDown" + eventClassName, globalTouchStart);
+            $(window).bind("MSPointerUp" + eventClassName, globalTouchEnd);
+            $this.bind("MSPointerDown" + eventClassName, touchStart);
+            $this.bind("MSPointerMove" + eventClassName, touchMove);
+            $this.bind("MSPointerUp" + eventClassName, touchEnd);
+          }
         }
       }
 
@@ -689,7 +695,7 @@
         bindMouseWheelHandler();
 
         if (supportsTouch || supportsIePointer) {
-          bindTouchHandler();
+          bindTouchHandler(supportsTouch, supportsIePointer);
         }
         if (settings.useKeyboard) {
           bindKeyboardHandler();