github
/
AdminLTE
mirror of https://github.com/ColorlibHQ/AdminLTE
1
0
Fork 0
Code Issues Releases Wiki Activity

Fixed IE10 issue

pull/556/head^2
Abdullah Almsaeed 2015-02-16 12:56:28 -05:00
parent 174be54e9b
commit f84eb88bcf
2 changed files with 204 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

386
plugins/slimScroll/jquery.slimscroll.js
View File

@ -5,90 +5,68 @@
* Version: 1.3.3 * Version: 1.3.3
* *
*/ */
(function($) { (function ($) {
$.fn.extend({ $.fn.extend({
slimScroll: function(options) { slimScroll: function (options) {
var defaults = { var defaults = {
// width in pixels of the visible scroll area // width in pixels of the visible scroll area
width : 'auto', width: 'auto',
// height in pixels of the visible scroll area // height in pixels of the visible scroll area
height : '250px', height: '250px',
// width in pixels of the scrollbar and rail // width in pixels of the scrollbar and rail
size : '7px', size: '7px',
// scrollbar color, accepts any hex/color value // scrollbar color, accepts any hex/color value
color: '#000', color: '#000',
// scrollbar position - left/right // scrollbar position - left/right
position : 'right', position: 'right',
// distance in pixels between the side edge and the scrollbar // distance in pixels between the side edge and the scrollbar
distance : '1px', distance: '1px',
// default scroll position on load - top / bottom / $('selector') // default scroll position on load - top / bottom / $('selector')
start : 'top', start: 'top',
// sets scrollbar opacity // sets scrollbar opacity
opacity : .4, opacity: .4,
// enables always-on mode for the scrollbar // enables always-on mode for the scrollbar
alwaysVisible : false, alwaysVisible: false,
// check if we should hide the scrollbar when user is hovering over // check if we should hide the scrollbar when user is hovering over
disableFadeOut : false, disableFadeOut: false,
// sets visibility of the rail // sets visibility of the rail
railVisible : false, railVisible: false,
// sets rail color // sets rail color
railColor : '#333', railColor: '#333',
// sets rail opacity // sets rail opacity
railOpacity : .2, railOpacity: .2,
// whether we should use jQuery UI Draggable to enable bar dragging // whether we should use jQuery UI Draggable to enable bar dragging
railDraggable : true, railDraggable: true,
// defautlt CSS class of the slimscroll rail // defautlt CSS class of the slimscroll rail
railClass : 'slimScrollRail', railClass: 'slimScrollRail',
// defautlt CSS class of the slimscroll bar // defautlt CSS class of the slimscroll bar
barClass : 'slimScrollBar', barClass: 'slimScrollBar',
// defautlt CSS class of the slimscroll wrapper // defautlt CSS class of the slimscroll wrapper
wrapperClass : 'slimScrollDiv', wrapperClass: 'slimScrollDiv',
// check if mousewheel should scroll the window if we reach top/bottom // check if mousewheel should scroll the window if we reach top/bottom
allowPageScroll : false, allowPageScroll: false,
// scroll amount applied to each mouse wheel step // scroll amount applied to each mouse wheel step
wheelStep : 20, wheelStep: 20,
// scroll amount applied when user is using gestures // scroll amount applied when user is using gestures
touchScrollStep : 200, touchScrollStep: 200,
// sets border radius // sets border radius
borderRadius: '7px', borderRadius: '7px',
// sets border radius of the rail // sets border radius of the rail
railBorderRadius : '7px' railBorderRadius: '7px'
}; };
var o = $.extend(defaults, options); var o = $.extend(defaults, options);
// do it for every element that matches selector // do it for every element that matches selector
this.each(function(){ this.each(function () {
var isOverPanel, isOverBar, isDragg, queueHide, touchDif, var isOverPanel, isOverBar, isDragg, queueHide, touchDif,
barHeight, percentScroll, lastScroll, barHeight, percentScroll, lastScroll,
divS = '<div></div>', divS = '<div></div>',
minBarHeight = 30, minBarHeight = 30,
releaseScroll = false; releaseScroll = false;
// used in event handlers and for better minification // used in event handlers and for better minification
var me = $(this); var me = $(this);
@ -96,58 +74,58 @@
// ensure we are not binding it again // ensure we are not binding it again
if (me.parent().hasClass(o.wrapperClass)) if (me.parent().hasClass(o.wrapperClass))
{ {
// start from last bar position // start from last bar position
var offset = me.scrollTop(); var offset = me.scrollTop();
// find bar and rail // find bar and rail
bar = me.parent().find('.' + o.barClass); bar = me.parent().find('.' + o.barClass);
rail = me.parent().find('.' + o.railClass); rail = me.parent().find('.' + o.railClass);
getBarHeight(); getBarHeight();
// check if we should scroll existing instance // check if we should scroll existing instance
if ($.isPlainObject(options)) if ($.isPlainObject(options))
{ {
// Pass height: auto to an existing slimscroll object to force a resize after contents have changed // Pass height: auto to an existing slimscroll object to force a resize after contents have changed
if ( 'height' in options && options.height == 'auto' ) { if ('height' in options && options.height == 'auto') {
me.parent().css('height', 'auto'); me.parent().css('height', 'auto');
me.css('height', 'auto'); me.css('height', 'auto');
var height = me.parent().parent().height(); var height = me.parent().parent().height();
me.parent().css('height', height); me.parent().css('height', height);
me.css('height', height); me.css('height', height);
}
if ('scrollTo' in options)
{
// jump to a static point
offset = parseInt(o.scrollTo);
}
else if ('scrollBy' in options)
{
// jump by value pixels
offset += parseInt(o.scrollBy);
}
else if ('destroy' in options)
{
// remove slimscroll elements
bar.remove();
rail.remove();
me.unwrap();
return;
}
// scroll content by the given offset
scrollContent(offset, false, true);
} }
return; if ('scrollTo' in options)
{
// jump to a static point
offset = parseInt(o.scrollTo);
}
else if ('scrollBy' in options)
{
// jump by value pixels
offset += parseInt(o.scrollBy);
}
else if ('destroy' in options)
{
// remove slimscroll elements
bar.remove();
rail.remove();
me.unwrap();
return;
}
// scroll content by the given offset
scrollContent(offset, false, true);
}
return;
} }
else if ($.isPlainObject(options)) else if ($.isPlainObject(options))
{ {
if ('destroy' in options) if ('destroy' in options)
{ {
return; return;
} }
} }
// optionally set height to the parent's height // optionally set height to the parent's height
@ -155,55 +133,57 @@
// wrap content // wrap content
var wrapper = $(divS) var wrapper = $(divS)
.addClass(o.wrapperClass) .addClass(o.wrapperClass)
.css({ .css({
position: 'relative', position: 'relative',
overflow: 'hidden', overflow: 'hidden',
width: o.width, width: o.width,
height: o.height height: o.height
}); });
// update style for the div // update style for the div
me.css({ me.css({
overflow: 'hidden', overflow: 'hidden',
width: o.width, width: o.width,
height: o.height height: o.height,
//Fix for IE10
"-ms-touch-action": "none"
}); });
// create scrollbar rail // create scrollbar rail
var rail = $(divS) var rail = $(divS)
.addClass(o.railClass) .addClass(o.railClass)
.css({ .css({
width: o.size, width: o.size,
height: '100%', height: '100%',
position: 'absolute', position: 'absolute',
top: 0, top: 0,
display: (o.alwaysVisible && o.railVisible) ? 'block' : 'none', display: (o.alwaysVisible && o.railVisible) ? 'block' : 'none',
'border-radius': o.railBorderRadius, 'border-radius': o.railBorderRadius,
background: o.railColor, background: o.railColor,
opacity: o.railOpacity, opacity: o.railOpacity,
zIndex: 90 zIndex: 90
}); });
// create scrollbar // create scrollbar
var bar = $(divS) var bar = $(divS)
.addClass(o.barClass) .addClass(o.barClass)
.css({ .css({
background: o.color, background: o.color,
width: o.size, width: o.size,
position: 'absolute', position: 'absolute',
top: 0, top: 0,
opacity: o.opacity, opacity: o.opacity,
display: o.alwaysVisible ? 'block' : 'none', display: o.alwaysVisible ? 'block' : 'none',
'border-radius' : o.borderRadius, 'border-radius': o.borderRadius,
BorderRadius: o.borderRadius, BorderRadius: o.borderRadius,
MozBorderRadius: o.borderRadius, MozBorderRadius: o.borderRadius,
WebkitBorderRadius: o.borderRadius, WebkitBorderRadius: o.borderRadius,
zIndex: 99 zIndex: 99
}); });
// set position // set position
var posCss = (o.position == 'right') ? { right: o.distance } : { left: o.distance }; var posCss = (o.position == 'right') ? {right: o.distance} : {left: o.distance};
rail.css(posCss); rail.css(posCss);
bar.css(posCss); bar.css(posCss);
@ -215,25 +195,26 @@
me.parent().append(rail); me.parent().append(rail);
// make it draggable and no longer dependent on the jqueryUI // make it draggable and no longer dependent on the jqueryUI
if (o.railDraggable){ if (o.railDraggable) {
bar.bind("mousedown", function(e) { bar.bind("mousedown", function (e) {
var $doc = $(document); var $doc = $(document);
isDragg = true; isDragg = true;
t = parseFloat(bar.css('top')); t = parseFloat(bar.css('top'));
pageY = e.pageY; pageY = e.pageY;
$doc.bind("mousemove.slimscroll", function(e){ $doc.bind("mousemove.slimscroll", function (e) {
currTop = t + e.pageY - pageY; currTop = t + e.pageY - pageY;
bar.css('top', currTop); bar.css('top', currTop);
scrollContent(0, bar.position().top, false);// scroll content scrollContent(0, bar.position().top, false);// scroll content
}); });
$doc.bind("mouseup.slimscroll", function(e) { $doc.bind("mouseup.slimscroll", function (e) {
isDragg = false;hideBar(); isDragg = false;
hideBar();
$doc.unbind('.slimscroll'); $doc.unbind('.slimscroll');
}); });
return false; return false;
}).bind("selectstart.slimscroll", function(e){ }).bind("selectstart.slimscroll", function (e) {
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
return false; return false;
@ -241,53 +222,78 @@
} }
// on rail over // on rail over
rail.hover(function(){ rail.hover(function () {
showBar(); showBar();
}, function(){ }, function () {
hideBar(); hideBar();
}); });
// on bar over // on bar over
bar.hover(function(){ bar.hover(function () {
isOverBar = true; isOverBar = true;
}, function(){ }, function () {
isOverBar = false; isOverBar = false;
}); });
// show on parent mouseover // show on parent mouseover
me.hover(function(){ me.hover(function () {
isOverPanel = true; isOverPanel = true;
showBar(); showBar();
hideBar(); hideBar();
}, function(){ }, function () {
isOverPanel = false; isOverPanel = false;
hideBar(); hideBar();
}); });
// support for mobile if (window.navigator.msPointerEnabled) {
me.bind('touchstart', function(e,b){ // support for mobile
if (e.originalEvent.touches.length) me.bind('MSPointerDown', function (e, b) {
{ if (e.originalEvent.targetTouches.length)
// record where touch started {
touchDif = e.originalEvent.touches[0].pageY; // record where touch started
} touchDif = e.originalEvent.targetTouches[0].pageY;
}); }
});
me.bind('touchmove', function(e){ me.bind('MSPointerMove', function (e) {
// prevent scrolling the page if necessary // prevent scrolling the page if necessary
if(!releaseScroll) e.originalEvent.preventDefault();
{ if (e.originalEvent.targetTouches.length)
e.originalEvent.preventDefault(); {
} // see how far user swiped
if (e.originalEvent.touches.length) var diff = (touchDif - e.originalEvent.targetTouches[0].pageY) / o.touchScrollStep;
{ // scroll content
// see how far user swiped scrollContent(diff, true);
var diff = (touchDif - e.originalEvent.touches[0].pageY) / o.touchScrollStep; touchDif = e.originalEvent.targetTouches[0].pageY;
// scroll content
scrollContent(diff, true); }
touchDif = e.originalEvent.touches[0].pageY; });
} } else {
}); // support for mobile
me.bind('touchstart', function (e, b) {
if (e.originalEvent.touches.length)
{
// record where touch started
touchDif = e.originalEvent.touches[0].pageY;
}
});
me.bind('touchmove', function (e) {
// prevent scrolling the page if necessary
if (!releaseScroll)
{
e.originalEvent.preventDefault();
}
if (e.originalEvent.touches.length)
{
// see how far user swiped
var diff = (touchDif - e.originalEvent.touches[0].pageY) / o.touchScrollStep;
// scroll content
scrollContent(diff, true);
touchDif = e.originalEvent.touches[0].pageY;
}
});
}
// set up initial height // set up initial height
getBarHeight(); getBarHeight();
@ -296,7 +302,7 @@
if (o.start === 'bottom') if (o.start === 'bottom')
{ {
// scroll content to bottom // scroll content to bottom
bar.css({ top: me.outerHeight() - bar.outerHeight() }); bar.css({top: me.outerHeight() - bar.outerHeight()});
scrollContent(0, true); scrollContent(0, true);
} }
else if (o.start !== 'top') else if (o.start !== 'top')
@ -305,7 +311,9 @@
scrollContent($(o.start).position().top, null, true); scrollContent($(o.start).position().top, null, true);
// make sure bar stays hidden // make sure bar stays hidden
if (!o.alwaysVisible) { bar.hide(); } if (!o.alwaysVisible) {
bar.hide();
}
} }
// attach scroll events // attach scroll events
@ -314,13 +322,19 @@
function _onWheel(e) function _onWheel(e)
{ {
// use mouse wheel only when mouse is over // use mouse wheel only when mouse is over
if (!isOverPanel) { return; } if (!isOverPanel) {
return;
}
var e = e || window.event; var e = e || window.event;
var delta = 0; var delta = 0;
if (e.wheelDelta) { delta = -e.wheelDelta/120; } if (e.wheelDelta) {
if (e.detail) { delta = e.detail / 3; } delta = -e.wheelDelta / 120;
}
if (e.detail) {
delta = e.detail / 3;
}
var target = e.target || e.srcTarget || e.srcElement; var target = e.target || e.srcTarget || e.srcElement;
if ($(target).closest('.' + o.wrapperClass).is(me.parent())) { if ($(target).closest('.' + o.wrapperClass).is(me.parent())) {
@ -329,8 +343,12 @@
} }
// stop window scroll // stop window scroll
if (e.preventDefault && !releaseScroll) { e.preventDefault(); } if (e.preventDefault && !releaseScroll) {
if (!releaseScroll) { e.returnValue = false; } e.preventDefault();
}
if (!releaseScroll) {
e.returnValue = false;
}
} }
function scrollContent(y, isWheel, isJump) function scrollContent(y, isWheel, isJump)
@ -354,7 +372,7 @@
delta = (y > 0) ? Math.ceil(delta) : Math.floor(delta); delta = (y > 0) ? Math.ceil(delta) : Math.floor(delta);
// scroll the scrollbar // scroll the scrollbar
bar.css({ top: delta + 'px' }); bar.css({top: delta + 'px'});
} }
// calculate actual scroll amount // calculate actual scroll amount
@ -366,7 +384,7 @@
delta = y; delta = y;
var offsetTop = delta / me[0].scrollHeight * me.outerHeight(); var offsetTop = delta / me[0].scrollHeight * me.outerHeight();
offsetTop = Math.min(Math.max(offsetTop, 0), maxTop); offsetTop = Math.min(Math.max(offsetTop, 0), maxTop);
bar.css({ top: offsetTop + 'px' }); bar.css({top: offsetTop + 'px'});
} }
// scroll content // scroll content
@ -386,8 +404,8 @@
{ {
if (window.addEventListener) if (window.addEventListener)
{ {
this.addEventListener('DOMMouseScroll', _onWheel, false ); this.addEventListener('DOMMouseScroll', _onWheel, false);
this.addEventListener('mousewheel', _onWheel, false ); this.addEventListener('mousewheel', _onWheel, false);
} }
else else
{ {
@ -399,11 +417,11 @@
{ {
// calculate scrollbar height and make sure it is not too small // calculate scrollbar height and make sure it is not too small
barHeight = Math.max((me.outerHeight() / me[0].scrollHeight) * me.outerHeight(), minBarHeight); barHeight = Math.max((me.outerHeight() / me[0].scrollHeight) * me.outerHeight(), minBarHeight);
bar.css({ height: barHeight + 'px' }); bar.css({height: barHeight + 'px'});
// hide scrollbar if content is not long enough // hide scrollbar if content is not long enough
var display = barHeight == me.outerHeight() ? 'none' : 'block'; var display = barHeight == me.outerHeight() ? 'none' : 'block';
bar.css({ display: display }); bar.css({display: display});
} }
function showBar() function showBar()
@ -421,8 +439,8 @@
// publish approporiate event // publish approporiate event
if (lastScroll != percentScroll) if (lastScroll != percentScroll)
{ {
var msg = (~~percentScroll == 0) ? 'top' : 'bottom'; var msg = (~~percentScroll == 0) ? 'top' : 'bottom';
me.trigger('slimscroll', msg); me.trigger('slimscroll', msg);
} }
} }
else else
@ -432,13 +450,15 @@
lastScroll = percentScroll; lastScroll = percentScroll;
// show only when required // show only when required
if(barHeight >= me.outerHeight()) { if (barHeight >= me.outerHeight()) {
//allow window scroll //allow window scroll
releaseScroll = true; releaseScroll = true;
return; return;
} }
bar.stop(true,true).fadeIn('fast'); bar.stop(true, true).fadeIn('fast');
if (o.railVisible) { rail.stop(true,true).fadeIn('fast'); } if (o.railVisible) {
rail.stop(true, true).fadeIn('fast');
}
} }
function hideBar() function hideBar()
@ -446,7 +466,7 @@
// only hide when options allow it // only hide when options allow it
if (!o.alwaysVisible) if (!o.alwaysVisible)
{ {
queueHide = setTimeout(function(){ queueHide = setTimeout(function () {
if (!(o.disableFadeOut && isOverPanel) && !isOverBar && !isDragg) if (!(o.disableFadeOut && isOverPanel) && !isOverBar && !isDragg)
{ {
bar.fadeOut('slow'); bar.fadeOut('slow');

17
plugins/slimScroll/jquery.slimscroll.min.js vendored
View File

File diff suppressed because one or more lines are too long