From c024fd146eb136a18799949cc9043549f7a0c816 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=94=D0=B0=D0=BD=D0=B8=D0=BB?= Date: Mon, 26 Oct 2015 15:04:41 +0300 Subject: [PATCH] direct changes for product requirements --- jquery.scrollbar.css | 776 +++++++++++++++++++++++++--------------- jquery.scrollbar.js | 2 +- jquery.scrollbar.min.js | 2 +- 3 files changed, 486 insertions(+), 294 deletions(-) diff --git a/jquery.scrollbar.css b/jquery.scrollbar.css index 9f4e5ba..b9d3778 100644 --- a/jquery.scrollbar.css +++ b/jquery.scrollbar.css @@ -1,35 +1,54 @@ /*************** SCROLLBAR BASE CSS ***************/ .scroll-wrapper { - overflow: hidden !important; - padding: 0 !important; position: relative; + margin: 34px 0 0; + padding: 0 !important; + overflow: hidden !important; + height: 160px; + border: 2px solid #b8b8b8; + border-radius: 10px; +} + +.scroll-wrapper .wrapper { + margin: 25px 20px; +} + +.scroll-wrapper .wrapper h2 { + margin: 0 0 22px; + font-size: 16px; +} + +.scroll-wrapper .wrapper p { + margin: 0; + font-size: 12px; } .scroll-wrapper > .scroll-content { - border: none !important; - box-sizing: content-box !important; - height: auto; + position: relative !important; + top: 0; left: 0; margin: 0; - max-height: none; - max-width: none !important; - overflow: scroll !important; padding: 0; - position: relative !important; - top: 0; + overflow: scroll !important; + box-sizing: content-box !important; width: auto !important; + max-width: none !important; + height: auto; + max-height: none; + border: none !important; } .scroll-wrapper > .scroll-content::-webkit-scrollbar { - height: 0; width: 0; + height: 0; } .scroll-element { display: none; } -.scroll-element, .scroll-element div { +.scroll-element, +.scroll-element div { box-sizing: content-box; } @@ -40,33 +59,33 @@ .scroll-element .scroll-bar, .scroll-element .scroll-arrow { - cursor: default; + cursor: pointer; } .scroll-textarea { - border: 1px solid #cccccc; - border-top-color: #999999; + border: 1px solid #ccc; + border-top-color: #999; } .scroll-textarea > .scroll-content { overflow: hidden !important; } .scroll-textarea > .scroll-content > textarea { - border: none !important; + position: relative !important; + top: 0; + margin: 0; + padding: 2px; + overflow: scroll !important; box-sizing: border-box; + width: 100% !important; + max-width: none !important; height: 100% !important; - margin: 0; max-height: none !important; - max-width: none !important; - overflow: scroll !important; + border: none !important; outline: none; - padding: 2px; - position: relative !important; - top: 0; - width: 100% !important; } .scroll-textarea > .scroll-content > textarea::-webkit-scrollbar { - height: 0; width: 0; + height: 0; } @@ -80,35 +99,38 @@ /*************** SIMPLE INNER SCROLLBAR ***************/ .scrollbar-inner > .scroll-element, -.scrollbar-inner > .scroll-element div -{ - border: none; - margin: 0; - padding: 0; +.scrollbar-inner > .scroll-element div { position: absolute; z-index: 10; + margin: 0; + padding: 0; + border: none; +} + +.scrollbar-inner > .scroll-element { + margin: 6px 0; } .scrollbar-inner > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } .scrollbar-inner > .scroll-element.scroll-x { bottom: 2px; - height: 8px; left: 0; width: 100%; + height: 8px; } .scrollbar-inner > .scroll-element.scroll-y { - height: 100%; - right: 2px; top: 0; - width: 8px; + right: 5px; + width: 10px; + height: 145px; } .scrollbar-inner > .scroll-element .scroll-element_outer { @@ -118,32 +140,48 @@ .scrollbar-inner > .scroll-element .scroll-element_outer, .scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar { - -webkit-border-radius: 8px; - -moz-border-radius: 8px; - border-radius: 8px; + -webkit-border-radius: 5px; + -moz-border-radius: 5px; + border-radius: 5px; } -.scrollbar-inner > .scroll-element .scroll-element_track, +/*.scrollbar-inner > .scroll-element .scroll-element_track, .scrollbar-inner > .scroll-element .scroll-bar { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); opacity: 0.4; -} +}*/ -.scrollbar-inner > .scroll-element .scroll-element_track { background-color: #e0e0e0; } -.scrollbar-inner > .scroll-element .scroll-bar { background-color: #c2c2c2; } -.scrollbar-inner > .scroll-element:hover .scroll-bar { background-color: #919191; } -.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; } +.scrollbar-inner > .scroll-element .scroll-element_track { + background-color: transparent; +} +.scrollbar-inner > .scroll-element .scroll-bar { + background-color: #7d6ff9; +} +.scrollbar-inner > .scroll-element:hover .scroll-bar { + background-color: #919191; +} +.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { + background-color: #919191; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -12px; } -.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -12px; } +.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { + left: -12px; +} +.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { + top: -12px; +} -.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -12px; } -.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -12px; } +.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -12px; +} +.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -12px; +} @@ -157,76 +195,109 @@ /*************** SIMPLE OUTER SCROLLBAR ***************/ .scrollbar-outer > .scroll-element, -.scrollbar-outer > .scroll-element div -{ - border: none; - margin: 0; - padding: 0; +.scrollbar-outer > .scroll-element div { position: absolute; z-index: 10; + margin: 0; + padding: 0; + border: none; } .scrollbar-outer > .scroll-element { - background-color: #ffffff; + background-color: #fff; } .scrollbar-outer > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } .scrollbar-outer > .scroll-element.scroll-x { bottom: 0; - height: 12px; left: 0; width: 100%; + height: 12px; } .scrollbar-outer > .scroll-element.scroll-y { - height: 100%; - right: 0; top: 0; + right: 0; width: 12px; + height: 100%; } -.scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer { height: 8px; top: 2px; } -.scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer { left: 2px; width: 8px; } +.scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer { + top: 2px; + height: 8px; +} +.scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer { + left: 2px; + width: 8px; +} -.scrollbar-outer > .scroll-element .scroll-element_outer { overflow: hidden; } -.scrollbar-outer > .scroll-element .scroll-element_track { background-color: #eeeeee; } +.scrollbar-outer > .scroll-element .scroll-element_outer { + overflow: hidden; +} +.scrollbar-outer > .scroll-element .scroll-element_track { + background-color: #eee; +} .scrollbar-outer > .scroll-element .scroll-element_outer, .scrollbar-outer > .scroll-element .scroll-element_track, .scrollbar-outer > .scroll-element .scroll-bar { -webkit-border-radius: 8px; - -moz-border-radius: 8px; - border-radius: 8px; + -moz-border-radius: 8px; + border-radius: 8px; } -.scrollbar-outer > .scroll-element .scroll-bar { background-color: #d9d9d9; } -.scrollbar-outer > .scroll-element .scroll-bar:hover { background-color: #c2c2c2; } -.scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; } +.scrollbar-outer > .scroll-element .scroll-bar { + background-color: #d9d9d9; +} +.scrollbar-outer > .scroll-element .scroll-bar:hover { + background-color: #c2c2c2; +} +.scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar { + background-color: #919191; +} /* scrollbar height/width & offset from container borders */ -.scrollbar-outer > .scroll-content.scroll-scrolly_visible { left: -12px; margin-left: 12px; } -.scrollbar-outer > .scroll-content.scroll-scrollx_visible { top: -12px; margin-top: 12px; } +.scrollbar-outer > .scroll-content.scroll-scrolly_visible { + left: -12px; + margin-left: 12px; +} +.scrollbar-outer > .scroll-content.scroll-scrollx_visible { + top: -12px; + margin-top: 12px; +} -.scrollbar-outer > .scroll-element.scroll-x .scroll-bar { min-width: 10px; } -.scrollbar-outer > .scroll-element.scroll-y .scroll-bar { min-height: 10px; } +.scrollbar-outer > .scroll-element.scroll-x .scroll-bar { + min-width: 10px; +} +.scrollbar-outer > .scroll-element.scroll-y .scroll-bar { + min-height: 10px; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -14px; } -.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -14px; } +.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { + left: -14px; +} +.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { + top: -14px; +} -.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -14px; } -.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -14px; } +.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -14px; +} +.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -14px; +} @@ -240,81 +311,101 @@ /*************** SCROLLBAR MAC OS X ***************/ .scrollbar-macosx > .scroll-element, -.scrollbar-macosx > .scroll-element div -{ - background: none; - border: none; - margin: 0; - padding: 0; +.scrollbar-macosx > .scroll-element div { position: absolute; z-index: 10; + margin: 0; + padding: 0; + background: none; + border: none; } .scrollbar-macosx > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } -.scrollbar-macosx > .scroll-element .scroll-element_track { display: none; } +.scrollbar-macosx > .scroll-element .scroll-element_track { + display: none; +} .scrollbar-macosx > .scroll-element .scroll-bar { - background-color: #6C6E71; display: block; - - -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; - filter: alpha(opacity=0); - opacity: 0; - + background-color: #6c6e71; -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; + opacity: 0; + -webkit-transition: opacity .2s linear; + -moz-transition: opacity .2s linear; + -ms-transition: opacity .2s linear; + -o-transition: opacity .2s linear; + transition: opacity .2s linear; - -webkit-transition: opacity 0.2s linear; - -moz-transition: opacity 0.2s linear; - -o-transition: opacity 0.2s linear; - -ms-transition: opacity 0.2s linear; - transition: opacity 0.2s linear; + -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; + filter: alpha(opacity=0); } .scrollbar-macosx:hover > .scroll-element .scroll-bar, .scrollbar-macosx > .scroll-element.scroll-draggable .scroll-bar { - -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; - filter: alpha(opacity=70); - opacity: 0.7; + opacity: .7; + + -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=70)'; + filter: alpha(opacity=70); } .scrollbar-macosx > .scroll-element.scroll-x { - bottom: 0px; - height: 0px; + bottom: 0; left: 0; - min-width: 100%; overflow: visible; width: 100%; + min-width: 100%; + height: 0; } .scrollbar-macosx > .scroll-element.scroll-y { + top: 0; + right: 0; + width: 0; height: 100%; min-height: 100%; - right: 0px; - top: 0; - width: 0px; } /* scrollbar height/width & offset from container borders */ -.scrollbar-macosx > .scroll-element.scroll-x .scroll-bar { height: 7px; min-width: 10px; top: -9px; } -.scrollbar-macosx > .scroll-element.scroll-y .scroll-bar { left: -9px; min-height: 10px; width: 7px; } +.scrollbar-macosx > .scroll-element.scroll-x .scroll-bar { + top: -9px; + min-width: 10px; + height: 7px; +} +.scrollbar-macosx > .scroll-element.scroll-y .scroll-bar { + left: -9px; + width: 7px; + min-height: 10px; +} -.scrollbar-macosx > .scroll-element.scroll-x .scroll-element_outer { left: 2px; } -.scrollbar-macosx > .scroll-element.scroll-x .scroll-element_size { left: -4px; } +.scrollbar-macosx > .scroll-element.scroll-x .scroll-element_outer { + left: 2px; +} +.scrollbar-macosx > .scroll-element.scroll-x .scroll-element_size { + left: -4px; +} -.scrollbar-macosx > .scroll-element.scroll-y .scroll-element_outer { top: 2px; } -.scrollbar-macosx > .scroll-element.scroll-y .scroll-element_size { top: -4px; } +.scrollbar-macosx > .scroll-element.scroll-y .scroll-element_outer { + top: 2px; +} +.scrollbar-macosx > .scroll-element.scroll-y .scroll-element_size { + top: -4px; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-macosx > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -11px; } -.scrollbar-macosx > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -11px; } +.scrollbar-macosx > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -11px; +} +.scrollbar-macosx > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -11px; +} @@ -329,100 +420,132 @@ .scrollbar-light > .scroll-element, .scrollbar-light > .scroll-element div { - border: none; - margin: 0; - overflow: hidden; - padding: 0; position: absolute; z-index: 10; + margin: 0; + padding: 0; + overflow: hidden; + border: none; } .scrollbar-light > .scroll-element { - background-color: #ffffff; + background-color: #fff; } .scrollbar-light > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } .scrollbar-light > .scroll-element .scroll-element_outer { -webkit-border-radius: 10px; - -moz-border-radius: 10px; - border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; } .scrollbar-light > .scroll-element .scroll-element_size { background: #dbdbdb; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlOGU4ZTgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+'); - background: -moz-linear-gradient(left, #dbdbdb 0%, #e8e8e8 100%); + background: -moz-linear-gradient(left, #dbdbdb 0%, #e8e8e8 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,#dbdbdb), color-stop(100%,#e8e8e8)); background: -webkit-linear-gradient(left, #dbdbdb 0%,#e8e8e8 100%); - background: -o-linear-gradient(left, #dbdbdb 0%,#e8e8e8 100%); - background: -ms-linear-gradient(left, #dbdbdb 0%,#e8e8e8 100%); - background: linear-gradient(to right, #dbdbdb 0%,#e8e8e8 100%); - + background: -o-linear-gradient(left, #dbdbdb 0%,#e8e8e8 100%); + background: -ms-linear-gradient(left, #dbdbdb 0%,#e8e8e8 100%); + background: linear-gradient(to right, #dbdbdb 0%,#e8e8e8 100%); -webkit-border-radius: 10px; - -moz-border-radius: 10px; - border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; } .scrollbar-light > .scroll-element.scroll-x { bottom: 0; - height: 17px; left: 0; - min-width: 100%; width: 100%; + min-width: 100%; + height: 17px; } .scrollbar-light > .scroll-element.scroll-y { - height: 100%; - min-height: 100%; - right: 0; top: 0; + right: 0; width: 17px; + height: 100%; + min-height: 100%; } .scrollbar-light > .scroll-element .scroll-bar { background: #fefefe; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmVmZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmNWY1ZjUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+'); - background: -moz-linear-gradient(left, #fefefe 0%, #f5f5f5 100%); + background: -moz-linear-gradient(left, #fefefe 0%, #f5f5f5 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fefefe), color-stop(100%,#f5f5f5)); background: -webkit-linear-gradient(left, #fefefe 0%,#f5f5f5 100%); - background: -o-linear-gradient(left, #fefefe 0%,#f5f5f5 100%); - background: -ms-linear-gradient(left, #fefefe 0%,#f5f5f5 100%); - background: linear-gradient(to right, #fefefe 0%,#f5f5f5 100%); - + background: -o-linear-gradient(left, #fefefe 0%,#f5f5f5 100%); + background: -ms-linear-gradient(left, #fefefe 0%,#f5f5f5 100%); + background: linear-gradient(to right, #fefefe 0%,#f5f5f5 100%); border: 1px solid #dbdbdb; -webkit-border-radius: 10px; - -moz-border-radius: 10px; - border-radius: 10px; + -moz-border-radius: 10px; + border-radius: 10px; } /* scrollbar height/width & offset from container borders */ -.scrollbar-light > .scroll-content.scroll-scrolly_visible { left: -17px; margin-left: 17px; } -.scrollbar-light > .scroll-content.scroll-scrollx_visible { top: -17px; margin-top: 17px; } +.scrollbar-light > .scroll-content.scroll-scrolly_visible { + left: -17px; + margin-left: 17px; +} +.scrollbar-light > .scroll-content.scroll-scrollx_visible { + top: -17px; + margin-top: 17px; +} -.scrollbar-light > .scroll-element.scroll-x .scroll-bar { height: 10px; min-width: 10px; top: 0px; } -.scrollbar-light > .scroll-element.scroll-y .scroll-bar { left: 0px; min-height: 10px; width: 10px; } +.scrollbar-light > .scroll-element.scroll-x .scroll-bar { + top: 0; + min-width: 10px; + height: 10px; +} +.scrollbar-light > .scroll-element.scroll-y .scroll-bar { + left: 0; + width: 10px; + min-height: 10px; +} -.scrollbar-light > .scroll-element.scroll-x .scroll-element_outer { height: 12px; left: 2px; top: 2px; } -.scrollbar-light > .scroll-element.scroll-x .scroll-element_size { left: -4px; } +.scrollbar-light > .scroll-element.scroll-x .scroll-element_outer { + top: 2px; + left: 2px; + height: 12px; +} +.scrollbar-light > .scroll-element.scroll-x .scroll-element_size { + left: -4px; +} -.scrollbar-light > .scroll-element.scroll-y .scroll-element_outer { left: 2px; top: 2px; width: 12px; } -.scrollbar-light > .scroll-element.scroll-y .scroll-element_size { top: -4px; } +.scrollbar-light > .scroll-element.scroll-y .scroll-element_outer { + top: 2px; + left: 2px; + width: 12px; +} +.scrollbar-light > .scroll-element.scroll-y .scroll-element_size { + top: -4px; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-light > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -19px; } -.scrollbar-light > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -19px; } +.scrollbar-light > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -19px; +} +.scrollbar-light > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -19px; +} -.scrollbar-light > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -19px; } -.scrollbar-light > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -19px; } +.scrollbar-light > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { + left: -19px; +} +.scrollbar-light > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { + top: -19px; +} @@ -436,91 +559,124 @@ /*************** SCROLLBAR RAIL ***************/ .scrollbar-rail > .scroll-element, -.scrollbar-rail > .scroll-element div -{ - border: none; - margin: 0; - overflow: hidden; - padding: 0; +.scrollbar-rail > .scroll-element div { position: absolute; z-index: 10; + margin: 0; + padding: 0; + overflow: hidden; + border: none; } .scrollbar-rail > .scroll-element { - background-color: #ffffff; + background-color: #fff; } .scrollbar-rail > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } .scrollbar-rail > .scroll-element .scroll-element_size { background-color: #999; - background-color: rgba(0, 0, 0, 0.3); + background-color: rgba(0, 0, 0, .3); } .scrollbar-rail > .scroll-element .scroll-element_outer:hover .scroll-element_size { background-color: #666; - background-color: rgba(0, 0, 0, 0.5); + background-color: rgba(0, 0, 0, .5); } .scrollbar-rail > .scroll-element.scroll-x { bottom: 0; - height: 12px; left: 0; - min-width: 100%; padding: 3px 0 2px; width: 100%; + min-width: 100%; + height: 12px; } .scrollbar-rail > .scroll-element.scroll-y { - height: 100%; - min-height: 100%; - padding: 0 2px 0 3px; - right: 0; top: 0; + right: 0; + padding: 0 2px 0 3px; width: 12px; + height: 100%; + min-height: 100%; } .scrollbar-rail > .scroll-element .scroll-bar { background-color: #d0b9a0; - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; - - box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); + -moz-border-radius: 2px; + border-radius: 2px; + box-shadow: 1px 1px 3px rgba(0, 0, 0, .5); } .scrollbar-rail > .scroll-element .scroll-element_outer:hover .scroll-bar { - box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.6); + box-shadow: 1px 1px 3px rgba(0, 0, 0, .6); } /* scrollbar height/width & offset from container borders */ -.scrollbar-rail > .scroll-content.scroll-scrolly_visible { left: -17px; margin-left: 17px; } -.scrollbar-rail > .scroll-content.scroll-scrollx_visible { margin-top: 17px; top: -17px; } +.scrollbar-rail > .scroll-content.scroll-scrolly_visible { + left: -17px; + margin-left: 17px; +} +.scrollbar-rail > .scroll-content.scroll-scrollx_visible { + top: -17px; + margin-top: 17px; +} -.scrollbar-rail > .scroll-element.scroll-x .scroll-bar { height: 10px; min-width: 10px; top: 1px; } -.scrollbar-rail > .scroll-element.scroll-y .scroll-bar { left: 1px; min-height: 10px; width: 10px; } +.scrollbar-rail > .scroll-element.scroll-x .scroll-bar { + top: 1px; + min-width: 10px; + height: 10px; +} +.scrollbar-rail > .scroll-element.scroll-y .scroll-bar { + left: 1px; + width: 10px; + min-height: 10px; +} -.scrollbar-rail > .scroll-element.scroll-x .scroll-element_outer { height: 15px; left: 5px; } -.scrollbar-rail > .scroll-element.scroll-x .scroll-element_size { height: 2px; left: -10px; top: 5px; } +.scrollbar-rail > .scroll-element.scroll-x .scroll-element_outer { + left: 5px; + height: 15px; +} +.scrollbar-rail > .scroll-element.scroll-x .scroll-element_size { + top: 5px; + left: -10px; + height: 2px; +} -.scrollbar-rail > .scroll-element.scroll-y .scroll-element_outer { top: 5px; width: 15px; } -.scrollbar-rail > .scroll-element.scroll-y .scroll-element_size { left: 5px; top: -10px; width: 2px; } +.scrollbar-rail > .scroll-element.scroll-y .scroll-element_outer { + top: 5px; + width: 15px; +} +.scrollbar-rail > .scroll-element.scroll-y .scroll-element_size { + top: -10px; + left: 5px; + width: 2px; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-rail > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -25px; } -.scrollbar-rail > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -25px; } +.scrollbar-rail > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -25px; +} +.scrollbar-rail > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -25px; +} -.scrollbar-rail > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -25px; } -.scrollbar-rail > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -25px; } +.scrollbar-rail > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { + left: -25px; +} +.scrollbar-rail > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { + top: -25px; +} @@ -534,117 +690,118 @@ /*************** SCROLLBAR DYNAMIC ***************/ .scrollbar-dynamic > .scroll-element, -.scrollbar-dynamic > .scroll-element div -{ - background: none; - border: none; - margin: 0; - padding: 0; +.scrollbar-dynamic > .scroll-element div { position: absolute; z-index: 10; + margin: 0; + padding: 0; + background: none; + border: none; } .scrollbar-dynamic > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } .scrollbar-dynamic > .scroll-element.scroll-x { bottom: 2px; - height: 7px; left: 0; - min-width: 100%; width: 100%; + min-width: 100%; + height: 7px; } .scrollbar-dynamic > .scroll-element.scroll-y { - height: 100%; - min-height: 100%; - right: 2px; top: 0; + right: 2px; width: 7px; + height: 100%; + min-height: 100%; } .scrollbar-dynamic > .scroll-element .scroll-element_outer { - opacity: 0.3; - -webkit-border-radius: 12px; - -moz-border-radius: 12px; - border-radius: 12px; + -moz-border-radius: 12px; + border-radius: 12px; + opacity: .3; } .scrollbar-dynamic > .scroll-element .scroll-element_size { - background-color: #cccccc; - opacity: 0; - + background-color: #ccc; -webkit-border-radius: 12px; - -moz-border-radius: 12px; - border-radius: 12px; - - -webkit-transition: opacity 0.2s; - -moz-transition: opacity 0.2s; - -o-transition: opacity 0.2s; - -ms-transition: opacity 0.2s; - transition: opacity 0.2s; + -moz-border-radius: 12px; + border-radius: 12px; + opacity: 0; + -webkit-transition: opacity .2s; + -moz-transition: opacity .2s; + -ms-transition: opacity .2s; + -o-transition: opacity .2s; + transition: opacity .2s; } .scrollbar-dynamic > .scroll-element .scroll-bar { background-color: #6c6e71; - -webkit-border-radius: 7px; - -moz-border-radius: 7px; - border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; } /* scrollbar height/width & offset from container borders */ .scrollbar-dynamic > .scroll-element.scroll-x .scroll-bar { + top: auto; bottom: 0; - height: 7px; min-width: 24px; - top: auto; + height: 7px; } .scrollbar-dynamic > .scroll-element.scroll-y .scroll-bar { - left: auto; - min-height: 24px; right: 0; + left: auto; width: 7px; + min-height: 24px; } .scrollbar-dynamic > .scroll-element.scroll-x .scroll-element_outer { - bottom: 0; top: auto; + bottom: 0; left: 2px; - - -webkit-transition: height 0.2s; - -moz-transition: height 0.2s; - -o-transition: height 0.2s; - -ms-transition: height 0.2s; - transition: height 0.2s; + -webkit-transition: height .2s; + -moz-transition: height .2s; + -ms-transition: height .2s; + -o-transition: height .2s; + transition: height .2s; } .scrollbar-dynamic > .scroll-element.scroll-y .scroll-element_outer { - left: auto; - right: 0; top: 2px; - - -webkit-transition: width 0.2s; - -moz-transition: width 0.2s; - -o-transition: width 0.2s; - -ms-transition: width 0.2s; - transition: width 0.2s; + right: 0; + left: auto; + -webkit-transition: width .2s; + -moz-transition: width .2s; + -ms-transition: width .2s; + -o-transition: width .2s; + transition: width .2s; } -.scrollbar-dynamic > .scroll-element.scroll-x .scroll-element_size { left: -4px; } -.scrollbar-dynamic > .scroll-element.scroll-y .scroll-element_size { top: -4px; } +.scrollbar-dynamic > .scroll-element.scroll-x .scroll-element_size { + left: -4px; +} +.scrollbar-dynamic > .scroll-element.scroll-y .scroll-element_size { + top: -4px; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-dynamic > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -11px; } -.scrollbar-dynamic > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -11px; } +.scrollbar-dynamic > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -11px; +} +.scrollbar-dynamic > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -11px; +} /* hover & drag */ @@ -652,10 +809,10 @@ .scrollbar-dynamic > .scroll-element:hover .scroll-element_outer, .scrollbar-dynamic > .scroll-element.scroll-draggable .scroll-element_outer { overflow: hidden; + opacity: .7; - -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; - filter: alpha(opacity=70); - opacity: 0.7; + -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=70)'; + filter: alpha(opacity=70); } .scrollbar-dynamic > .scroll-element:hover .scroll-element_outer .scroll-element_size, .scrollbar-dynamic > .scroll-element.scroll-draggable .scroll-element_outer .scroll-element_size { @@ -663,12 +820,11 @@ } .scrollbar-dynamic > .scroll-element:hover .scroll-element_outer .scroll-bar, .scrollbar-dynamic > .scroll-element.scroll-draggable .scroll-element_outer .scroll-bar { - height: 100%; width: 100%; - + height: 100%; -webkit-border-radius: 12px; - -moz-border-radius: 12px; - border-radius: 12px; + -moz-border-radius: 12px; + border-radius: 12px; } .scrollbar-dynamic > .scroll-element.scroll-x:hover .scroll-element_outer, @@ -678,8 +834,8 @@ } .scrollbar-dynamic > .scroll-element.scroll-y:hover .scroll-element_outer, .scrollbar-dynamic > .scroll-element.scroll-y.scroll-draggable .scroll-element_outer { - min-width: 7px; width: 20px; + min-width: 7px; } @@ -694,29 +850,28 @@ /*************** SCROLLBAR GOOGLE CHROME ***************/ .scrollbar-chrome > .scroll-element, -.scrollbar-chrome > .scroll-element div -{ - border: none; - margin: 0; - overflow: hidden; - padding: 0; +.scrollbar-chrome > .scroll-element div { position: absolute; z-index: 10; + margin: 0; + padding: 0; + overflow: hidden; + border: none; } .scrollbar-chrome > .scroll-element { - background-color: #ffffff; + background-color: #fff; } .scrollbar-chrome > .scroll-element div { - display: block; - height: 100%; - left: 0; top: 0; + left: 0; + display: block; width: 100%; + height: 100%; } -.scrollbar-chrome > .scroll-element .scroll-element_outer {} + .scrollbar-chrome > .scroll-element .scroll-element_track { background: #f1f1f1; @@ -725,28 +880,27 @@ .scrollbar-chrome > .scroll-element.scroll-x { bottom: 0; - height: 16px; left: 0; - min-width: 100%; width: 100%; + min-width: 100%; + height: 16px; } .scrollbar-chrome > .scroll-element.scroll-y { - height: 100%; - min-height: 100%; - right: 0; top: 0; + right: 0; width: 16px; + height: 100%; + min-height: 100%; } .scrollbar-chrome > .scroll-element .scroll-bar { + cursor: default; background-color: #d9d9d9; border: 1px solid #bdbdbd; - cursor: default; - -webkit-border-radius: 2px; - -moz-border-radius: 2px; - border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; } .scrollbar-chrome > .scroll-element .scroll-bar:hover { @@ -761,27 +915,65 @@ /* scrollbar height/width & offset from container borders */ -.scrollbar-chrome > .scroll-content.scroll-scrolly_visible { left: -16px; margin-left: 16px; } -.scrollbar-chrome > .scroll-content.scroll-scrollx_visible { top: -16px; margin-top: 16px; } +.scrollbar-chrome > .scroll-content.scroll-scrolly_visible { + left: -16px; + margin-left: 16px; +} +.scrollbar-chrome > .scroll-content.scroll-scrollx_visible { + top: -16px; + margin-top: 16px; +} -.scrollbar-chrome > .scroll-element.scroll-x .scroll-bar { height: 8px; min-width: 10px; top: 3px; } -.scrollbar-chrome > .scroll-element.scroll-y .scroll-bar { left: 3px; min-height: 10px; width: 8px; } +.scrollbar-chrome > .scroll-element.scroll-x .scroll-bar { + top: 3px; + min-width: 10px; + height: 8px; +} +.scrollbar-chrome > .scroll-element.scroll-y .scroll-bar { + left: 3px; + width: 8px; + min-height: 10px; +} -.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_outer { border-left: 1px solid #dbdbdb; } -.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_track { height: 14px; left: -3px; } -.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_size { height: 14px; left: -4px; } +.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_outer { + border-left: 1px solid #dbdbdb; +} +.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_track { + left: -3px; + height: 14px; +} +.scrollbar-chrome > .scroll-element.scroll-x .scroll-element_size { + left: -4px; + height: 14px; +} -.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_outer { border-top: 1px solid #dbdbdb; } -.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_track { top: -3px; width: 14px; } -.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_size { top: -4px; width: 14px; } +.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_outer { + border-top: 1px solid #dbdbdb; +} +.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_track { + top: -3px; + width: 14px; +} +.scrollbar-chrome > .scroll-element.scroll-y .scroll-element_size { + top: -4px; + width: 14px; +} /* update scrollbar offset if both scrolls are visible */ -.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -19px; } -.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -19px; } +.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { + left: -19px; +} +.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { + top: -19px; +} -.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -19px; } -.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -19px; } +.scrollbar-chrome > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { + left: -19px; +} +.scrollbar-chrome > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { + top: -19px; +} diff --git a/jquery.scrollbar.js b/jquery.scrollbar.js index 77a2807..80f1900 100644 --- a/jquery.scrollbar.js +++ b/jquery.scrollbar.js @@ -486,7 +486,7 @@ var scrollSize = scrollx.scroll.size[cssFullSize]() + (parseInt(scrollx.scroll.size.css(cssOffset), 10) || 0); if (o.autoScrollSize) { - scrollx.scrollbarSize = parseInt(scrollSize * AreaVisible / AreaSize, 10); + scrollx.scrollbarSize = parseInt(37, 10); scrollx.scroll.bar.css(cssSize, scrollx.scrollbarSize + 'px'); } diff --git a/jquery.scrollbar.min.js b/jquery.scrollbar.min.js index 552f6ff..5767146 100644 --- a/jquery.scrollbar.min.js +++ b/jquery.scrollbar.min.js @@ -13,4 +13,4 @@ * @url https://github.com/gromo/jquery.scrollbar/ * */ -!function(l,e){"function"==typeof define&&define.amd?define(["jquery"],e):e(l.jQuery)}(this,function(l){"use strict";function e(e){if(t.webkit&&!e)return{height:0,width:0};if(!t.data.outer){var o={border:"none","box-sizing":"content-box",height:"200px",margin:"0",padding:"0",width:"200px"};t.data.inner=l("
").css(l.extend({},o)),t.data.outer=l("
").css(l.extend({left:"-1000px",overflow:"scroll",position:"absolute",top:"-1000px"},o)).append(t.data.inner).appendTo("body")}return t.data.outer.scrollLeft(1e3).scrollTop(1e3),{height:Math.ceil(t.data.outer.offset().top-t.data.inner.offset().top||0),width:Math.ceil(t.data.outer.offset().left-t.data.inner.offset().left||0)}}function o(){var l=e(!0);return!(l.height||l.width)}function s(l){var e=l.originalEvent;return e.axis&&e.axis===e.HORIZONTAL_AXIS?!1:e.wheelDeltaX?!1:!0}var r=!1,t={data:{index:0,name:"scrollbar"},macosx:-1!==navigator.platform.toLowerCase().indexOf("mac"),mobile:/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent),overlay:null,scroll:null,scrolls:[],webkit:/WebKit/.test(navigator.userAgent)};t.scrolls.add=function(l){this.remove(l).push(l)},t.scrolls.remove=function(e){for(;l.inArray(e,this)>=0;)this.splice(l.inArray(e,this),1);return this};var i={autoScrollSize:!0,autoUpdate:!0,debug:!1,disableBodyScroll:!1,duration:200,ignoreMobile:!1,ignoreOverlay:!1,scrollStep:30,showArrows:!1,stepScrolling:!0,scrollx:null,scrolly:null,onDestroy:null,onInit:null,onScroll:null,onUpdate:null},n=function(s){t.scroll||(t.overlay=o(),t.scroll=e(),c(),l(window).resize(function(){var l=!1;if(t.scroll&&(t.scroll.height||t.scroll.width)){var o=e();(o.height!==t.scroll.height||o.width!==t.scroll.width)&&(t.scroll=o,l=!0)}c(l)})),this.container=s,this.namespace=".scrollbar_"+t.data.index++,this.options=l.extend({},i,window.jQueryScrollbarOptions||{}),this.scrollTo=null,this.scrollx={},this.scrolly={},s.data(t.data.name,this),t.scrolls.add(this)};n.prototype={destroy:function(){if(this.wrapper){this.container.removeData(t.data.name),t.scrolls.remove(this);var e=this.container.scrollLeft(),o=this.container.scrollTop();this.container.insertBefore(this.wrapper).css({height:"",margin:"","max-height":""}).removeClass("scroll-content scroll-scrollx_visible scroll-scrolly_visible").off(this.namespace).scrollLeft(e).scrollTop(o),this.scrollx.scroll.removeClass("scroll-scrollx_visible").find("div").andSelf().off(this.namespace),this.scrolly.scroll.removeClass("scroll-scrolly_visible").find("div").andSelf().off(this.namespace),this.wrapper.remove(),l(document).add("body").off(this.namespace),l.isFunction(this.options.onDestroy)&&this.options.onDestroy.apply(this,[this.container])}},init:function(e){var o=this,r=this.container,i=this.containerWrapper||r,n=this.namespace,c=l.extend(this.options,e||{}),a={x:this.scrollx,y:this.scrolly},d=this.wrapper,u={scrollLeft:r.scrollLeft(),scrollTop:r.scrollTop()};if(t.mobile&&c.ignoreMobile||t.overlay&&c.ignoreOverlay||t.macosx&&!t.webkit)return!1;if(d)i.css({height:"auto","margin-bottom":-1*t.scroll.height+"px","margin-right":-1*t.scroll.width+"px","max-height":""});else{if(this.wrapper=d=l("
").addClass("scroll-wrapper").addClass(r.attr("class")).css("position","absolute"==r.css("position")?"absolute":"relative").insertBefore(r).append(r),r.is("textarea")&&(this.containerWrapper=i=l("
").insertBefore(r).append(r),d.addClass("scroll-textarea")),i.addClass("scroll-content").css({height:"auto","margin-bottom":-1*t.scroll.height+"px","margin-right":-1*t.scroll.width+"px","max-height":""}),r.on("scroll"+n,function(){l.isFunction(c.onScroll)&&c.onScroll.call(o,{maxScroll:a.y.maxScrollOffset,scroll:r.scrollTop(),size:a.y.size,visible:a.y.visible},{maxScroll:a.x.maxScrollOffset,scroll:r.scrollLeft(),size:a.x.size,visible:a.x.visible}),a.x.isVisible&&a.x.scroll.bar.css("left",r.scrollLeft()*a.x.kx+"px"),a.y.isVisible&&a.y.scroll.bar.css("top",r.scrollTop()*a.y.kx+"px")}),d.on("scroll"+n,function(){d.scrollTop(0).scrollLeft(0)}),c.disableBodyScroll){var f=function(l){s(l)?a.y.isVisible&&a.y.mousewheel(l):a.x.isVisible&&a.x.mousewheel(l)};d.on("MozMousePixelScroll"+n,f),d.on("mousewheel"+n,f),t.mobile&&d.on("touchstart"+n,function(e){var o=e.originalEvent.touches&&e.originalEvent.touches[0]||e,s={pageX:o.pageX,pageY:o.pageY},t={left:r.scrollLeft(),top:r.scrollTop()};l(document).on("touchmove"+n,function(l){var e=l.originalEvent.targetTouches&&l.originalEvent.targetTouches[0]||l;r.scrollLeft(t.left+s.pageX-e.pageX),r.scrollTop(t.top+s.pageY-e.pageY),l.preventDefault()}),l(document).on("touchend"+n,function(){l(document).off(n)})})}l.isFunction(c.onInit)&&c.onInit.apply(this,[r])}l.each(a,function(e,t){var i=null,d=1,u="x"===e?"scrollLeft":"scrollTop",f=c.scrollStep,h=function(){var l=r[u]();r[u](l+f),1==d&&l+f>=p&&(l=r[u]()),-1==d&&p>=l+f&&(l=r[u]()),r[u]()==l&&i&&i()},p=0;t.scroll||(t.scroll=o._getScroll(c["scroll"+e]).addClass("scroll-"+e),c.showArrows&&t.scroll.addClass("scroll-element_arrows_visible"),t.mousewheel=function(l){if(!t.isVisible||"x"===e&&s(l))return!0;if("y"===e&&!s(l))return a.x.mousewheel(l),!0;var i=-1*l.originalEvent.wheelDelta||l.originalEvent.detail,n=t.size-t.visible-t.offset;return(i>0&&n>p||0>i&&p>0)&&(p+=i,0>p&&(p=0),p>n&&(p=n),o.scrollTo=o.scrollTo||{},o.scrollTo[u]=p,setTimeout(function(){o.scrollTo&&(r.stop().animate(o.scrollTo,240,"linear",function(){p=r[u]()}),o.scrollTo=null)},1)),l.preventDefault(),!1},t.scroll.on("MozMousePixelScroll"+n,t.mousewheel).on("mousewheel"+n,t.mousewheel).on("mouseenter"+n,function(){p=r[u]()}),t.scroll.find(".scroll-arrow, .scroll-element_track").on("mousedown"+n,function(s){if(1!=s.which)return!0;d=1;var n={eventOffset:s["x"===e?"pageX":"pageY"],maxScrollValue:t.size-t.visible-t.offset,scrollbarOffset:t.scroll.bar.offset()["x"===e?"left":"top"],scrollbarSize:t.scroll.bar["x"===e?"outerWidth":"outerHeight"]()},a=0,v=0;return l(this).hasClass("scroll-arrow")?(d=l(this).hasClass("scroll-arrow_more")?1:-1,f=c.scrollStep*d,p=d>0?n.maxScrollValue:0):(d=n.eventOffset>n.scrollbarOffset+n.scrollbarSize?1:n.eventOffset1,o.isVisible?(o.scroll.addClass(s),n.scroll.addClass(s),i.addClass(s)):(o.scroll.removeClass(s),n.scroll.removeClass(s),i.removeClass(s)),"y"===e&&(o.isVisible||o.size','
','
','
','
','
','
','
','
',"
","
",'
','
','
',"
",'
','
',"
","
","
"].join(""),simple:['
','
','
','
','
',"
","
"].join("")};return o[e]&&(e=o[e]),e||(e=o.simple),e="string"==typeof e?l(e).appendTo(this.wrapper):l(e),l.extend(e,{bar:e.find(".scroll-bar"),size:e.find(".scroll-element_size"),track:e.find(".scroll-element_track")}),e},_handleMouseDown:function(e,o){var s=this.namespace;return l(document).on("blur"+s,function(){l(document).add("body").off(s),e&&e()}),l(document).on("dragstart"+s,function(l){return l.preventDefault(),!1}),l(document).on("mouseup"+s,function(){l(document).add("body").off(s),e&&e()}),l("body").on("selectstart"+s,function(l){return l.preventDefault(),!1}),o&&o.preventDefault(),!1}},l.fn.scrollbar=function(e,o){return"string"!=typeof e&&(o=e,e="init"),"undefined"==typeof o&&(o=[]),l.isArray(o)||(o=[o]),this.not("body, .scroll-wrapper").each(function(){var s=l(this),r=s.data(t.data.name);(r||"init"===e)&&(r||(r=new n(s)),r[e]&&r[e].apply(r,o))}),this},l.fn.scrollbar.options=i;var c=function(){var l=0,e=0;return function(o){var s,i,n,a,d,u,f;for(s=0;s10?(window.console&&console.log("Scroll updates exceed 10"),c=function(){}):(clearTimeout(l),l=setTimeout(c,300))}}();window.angular&&!function(l){l.module("jQueryScrollbar",[]).provider("jQueryScrollbar",function(){var e=i;return{setOptions:function(o){l.extend(e,o)},$get:function(){return{options:l.copy(e)}}}}).directive("jqueryScrollbar",function(l,e){return{restrict:"AC",link:function(o,s,r){var t=e(r.jqueryScrollbar),i=t(o);s.scrollbar(i||l.options).on("$destroy",function(){s.scrollbar("destroy")})}}})}(window.angular)}); \ No newline at end of file +!function(l,e){"function"==typeof define&&define.amd?define(["jquery"],e):e(l.jQuery)}(this,function(l){"use strict";function e(e){if(t.webkit&&!e)return{height:0,width:0};if(!t.data.outer){var o={border:"none","box-sizing":"content-box",height:"200px",margin:"0",padding:"0",width:"200px"};t.data.inner=l("
").css(l.extend({},o)),t.data.outer=l("
").css(l.extend({left:"-1000px",overflow:"scroll",position:"absolute",top:"-1000px"},o)).append(t.data.inner).appendTo("body")}return t.data.outer.scrollLeft(1e3).scrollTop(1e3),{height:Math.ceil(t.data.outer.offset().top-t.data.inner.offset().top||0),width:Math.ceil(t.data.outer.offset().left-t.data.inner.offset().left||0)}}function o(){var l=e(!0);return!(l.height||l.width)}function s(l){var e=l.originalEvent;return e.axis&&e.axis===e.HORIZONTAL_AXIS?!1:e.wheelDeltaX?!1:!0}var r=!1,t={data:{index:0,name:"scrollbar"},macosx:/mac/i.test(navigator.platform),mobile:/android|webos|iphone|ipad|ipod|blackberry/i.test(navigator.userAgent),overlay:null,scroll:null,scrolls:[],webkit:/webkit/i.test(navigator.userAgent)&&!/edge\/\d+/i.test(navigator.userAgent)};t.scrolls.add=function(l){this.remove(l).push(l)},t.scrolls.remove=function(e){for(;l.inArray(e,this)>=0;)this.splice(l.inArray(e,this),1);return this};var i={autoScrollSize:!0,autoUpdate:!0,debug:!1,disableBodyScroll:!1,duration:200,ignoreMobile:!1,ignoreOverlay:!1,scrollStep:30,showArrows:!1,stepScrolling:!0,scrollx:null,scrolly:null,onDestroy:null,onInit:null,onScroll:null,onUpdate:null},n=function(s){t.scroll||(t.overlay=o(),t.scroll=e(),a(),l(window).resize(function(){var l=!1;if(t.scroll&&(t.scroll.height||t.scroll.width)){var o=e();(o.height!==t.scroll.height||o.width!==t.scroll.width)&&(t.scroll=o,l=!0)}a(l)})),this.container=s,this.namespace=".scrollbar_"+t.data.index++,this.options=l.extend({},i,window.jQueryScrollbarOptions||{}),this.scrollTo=null,this.scrollx={},this.scrolly={},s.data(t.data.name,this),t.scrolls.add(this)};n.prototype={destroy:function(){if(this.wrapper){this.container.removeData(t.data.name),t.scrolls.remove(this);var e=this.container.scrollLeft(),o=this.container.scrollTop();this.container.insertBefore(this.wrapper).css({height:"",margin:"","max-height":""}).removeClass("scroll-content scroll-scrollx_visible scroll-scrolly_visible").off(this.namespace).scrollLeft(e).scrollTop(o),this.scrollx.scroll.removeClass("scroll-scrollx_visible").find("div").andSelf().off(this.namespace),this.scrolly.scroll.removeClass("scroll-scrolly_visible").find("div").andSelf().off(this.namespace),this.wrapper.remove(),l(document).add("body").off(this.namespace),l.isFunction(this.options.onDestroy)&&this.options.onDestroy.apply(this,[this.container])}},init:function(e){var o=this,r=this.container,i=this.containerWrapper||r,n=this.namespace,c=l.extend(this.options,e||{}),a={x:this.scrollx,y:this.scrolly},d=this.wrapper,h={scrollLeft:r.scrollLeft(),scrollTop:r.scrollTop()};if(t.mobile&&c.ignoreMobile||t.overlay&&c.ignoreOverlay||t.macosx&&!t.webkit)return!1;if(d)i.css({height:"auto","margin-bottom":-1*t.scroll.height+"px","margin-right":-1*t.scroll.width+"px","max-height":""});else{if(this.wrapper=d=l("
").addClass("scroll-wrapper").addClass(r.attr("class")).css("position","absolute"==r.css("position")?"absolute":"relative").insertBefore(r).append(r),r.is("textarea")&&(this.containerWrapper=i=l("
").insertBefore(r).append(r),d.addClass("scroll-textarea")),i.addClass("scroll-content").css({height:"auto","margin-bottom":-1*t.scroll.height+"px","margin-right":-1*t.scroll.width+"px","max-height":""}),r.on("scroll"+n,function(){l.isFunction(c.onScroll)&&c.onScroll.call(o,{maxScroll:a.y.maxScrollOffset,scroll:r.scrollTop(),size:a.y.size,visible:a.y.visible},{maxScroll:a.x.maxScrollOffset,scroll:r.scrollLeft(),size:a.x.size,visible:a.x.visible}),a.x.isVisible&&a.x.scroll.bar.css("left",r.scrollLeft()*a.x.kx+"px"),a.y.isVisible&&a.y.scroll.bar.css("top",r.scrollTop()*a.y.kx+"px")}),d.on("scroll"+n,function(){d.scrollTop(0).scrollLeft(0)}),c.disableBodyScroll){var p=function(l){s(l)?a.y.isVisible&&a.y.mousewheel(l):a.x.isVisible&&a.x.mousewheel(l)};d.on("MozMousePixelScroll"+n,p),d.on("mousewheel"+n,p),t.mobile&&d.on("touchstart"+n,function(e){var o=e.originalEvent.touches&&e.originalEvent.touches[0]||e,s={pageX:o.pageX,pageY:o.pageY},t={left:r.scrollLeft(),top:r.scrollTop()};l(document).on("touchmove"+n,function(l){var e=l.originalEvent.targetTouches&&l.originalEvent.targetTouches[0]||l;r.scrollLeft(t.left+s.pageX-e.pageX),r.scrollTop(t.top+s.pageY-e.pageY),l.preventDefault()}),l(document).on("touchend"+n,function(){l(document).off(n)})})}l.isFunction(c.onInit)&&c.onInit.apply(this,[r])}l.each(a,function(e,t){var i=null,d=1,h="x"===e?"scrollLeft":"scrollTop",p=c.scrollStep,u=function(){var l=r[h]();r[h](l+p),1==d&&l+p>=f&&(l=r[h]()),-1==d&&f>=l+p&&(l=r[h]()),r[h]()==l&&i&&i()},f=0;t.scroll||(t.scroll=o._getScroll(c["scroll"+e]).addClass("scroll-"+e),c.showArrows&&t.scroll.addClass("scroll-element_arrows_visible"),t.mousewheel=function(l){if(!t.isVisible||"x"===e&&s(l))return!0;if("y"===e&&!s(l))return a.x.mousewheel(l),!0;var i=-1*l.originalEvent.wheelDelta||l.originalEvent.detail,n=t.size-t.visible-t.offset;return(i>0&&n>f||0>i&&f>0)&&(f+=i,0>f&&(f=0),f>n&&(f=n),o.scrollTo=o.scrollTo||{},o.scrollTo[h]=f,setTimeout(function(){o.scrollTo&&(r.stop().animate(o.scrollTo,240,"linear",function(){f=r[h]()}),o.scrollTo=null)},1)),l.preventDefault(),!1},t.scroll.on("MozMousePixelScroll"+n,t.mousewheel).on("mousewheel"+n,t.mousewheel).on("mouseenter"+n,function(){f=r[h]()}),t.scroll.find(".scroll-arrow, .scroll-element_track").on("mousedown"+n,function(s){if(1!=s.which)return!0;d=1;var n={eventOffset:s["x"===e?"pageX":"pageY"],maxScrollValue:t.size-t.visible-t.offset,scrollbarOffset:t.scroll.bar.offset()["x"===e?"left":"top"],scrollbarSize:t.scroll.bar["x"===e?"outerWidth":"outerHeight"]()},a=0,v=0;return l(this).hasClass("scroll-arrow")?(d=l(this).hasClass("scroll-arrow_more")?1:-1,p=c.scrollStep*d,f=d>0?n.maxScrollValue:0):(d=n.eventOffset>n.scrollbarOffset+n.scrollbarSize?1:n.eventOffset','
','
','
','
','
','
','
','
',"
","
",'
','
','
',"
",'
','
',"
","
","
"].join(""),simple:['
','
','
','
','
',"
","
"].join("")};return o[e]&&(e=o[e]),e||(e=o.simple),e="string"==typeof e?l(e).appendTo(this.wrapper):l(e),l.extend(e,{bar:e.find(".scroll-bar"),size:e.find(".scroll-element_size"),track:e.find(".scroll-element_track")}),e},_handleMouseDown:function(e,o){var s=this.namespace;return l(document).on("blur"+s,function(){l(document).add("body").off(s),e&&e()}),l(document).on("dragstart"+s,function(l){return l.preventDefault(),!1}),l(document).on("mouseup"+s,function(){l(document).add("body").off(s),e&&e()}),l("body").on("selectstart"+s,function(l){return l.preventDefault(),!1}),o&&o.preventDefault(),!1},_updateScroll:function(e,o){var s=this.container,r=this.containerWrapper||s,i="scroll-scroll"+e+"_visible",n="x"===e?this.scrolly:this.scrollx,c=parseInt(this.container.css("x"===e?"left":"top"),10)||0,a=this.wrapper,d=o.size,h=o.visible+c;o.isVisible=d-h>1,o.isVisible?(o.scroll.addClass(i),n.scroll.addClass(i),r.addClass(i)):(o.scroll.removeClass(i),n.scroll.removeClass(i),r.removeClass(i)),"y"===e&&r.css(s.is("textarea")||h>d?{height:h+t.scroll.height+"px","max-height":"none"}:{"max-height":h+t.scroll.height+"px"}),(o.size!=s.prop("scrollWidth")||n.size!=s.prop("scrollHeight")||o.visible!=a.width()||n.visible!=a.height()||o.offset!=(parseInt(s.css("left"),10)||0)||n.offset!=(parseInt(s.css("top"),10)||0))&&(l.extend(this.scrollx,{offset:parseInt(s.css("left"),10)||0,size:s.prop("scrollWidth"),visible:a.width()}),l.extend(this.scrolly,{offset:parseInt(s.css("top"),10)||0,size:this.container.prop("scrollHeight"),visible:a.height()}),this._updateScroll("x"===e?"y":"x",n))}};var c=n;l.fn.scrollbar=function(e,o){return"string"!=typeof e&&(o=e,e="init"),"undefined"==typeof o&&(o=[]),l.isArray(o)||(o=[o]),this.not("body, .scroll-wrapper").each(function(){var s=l(this),r=s.data(t.data.name);(r||"init"===e)&&(r||(r=new c(s)),r[e]&&r[e].apply(r,o))}),this},l.fn.scrollbar.options=i;var a=function(){var l=0,e=0;return function(o){var s,i,n,c,d,h,p;for(s=0;s10?(window.console&&console.log("Scroll updates exceed 10"),a=function(){}):(clearTimeout(l),l=setTimeout(a,300))}}();window.angular&&!function(l){l.module("jQueryScrollbar",[]).provider("jQueryScrollbar",function(){var e=i;return{setOptions:function(o){l.extend(e,o)},$get:function(){return{options:l.copy(e)}}}}).directive("jqueryScrollbar",function(l,e){return{restrict:"AC",link:function(o,s,r){var t=e(r.jqueryScrollbar),i=t(o);s.scrollbar(i||l.options).on("$destroy",function(){s.scrollbar("destroy")})}}})}(window.angular)}); \ No newline at end of file