tinyscrollbar minor update
This commit is contained in:
parent
924ecc3b1f
commit
f2f8ffd157
|
@ -11,19 +11,20 @@
|
|||
* Depends on library: jQuery
|
||||
*
|
||||
*/
|
||||
( function( $ )
|
||||
;( function( $ )
|
||||
{
|
||||
$.tiny = $.tiny || { };
|
||||
|
||||
$.tiny.scrollbar = {
|
||||
options: {
|
||||
axis : 'y' // vertical or horizontal scrollbar? ( x || y ).
|
||||
, wheel : 40 // how many pixels must the mouswheel scroll at a time.
|
||||
, scroll : true // enable or disable the mousewheel.
|
||||
, lockscroll : true // return scrollwheel to browser if there is no more content.
|
||||
, size : 'auto' // set the size of the scrollbar to auto or a fixed number.
|
||||
, sizethumb : 'auto' // set the size of the thumb to auto or a fixed number.
|
||||
, onMove : function(){}
|
||||
axis : 'y' // vertical or horizontal scrollbar? ( x || y ).
|
||||
, wheel : 40 // how many pixels must the mouswheel scroll at a time.
|
||||
, scroll : true // enable or disable the mousewheel.
|
||||
, lockscroll : true // return scrollwheel to browser if there is no more content.
|
||||
, size : 'auto' // set the size of the scrollbar to auto or a fixed number.
|
||||
, sizethumb : 'auto' // set the size of the thumb to auto or a fixed number.
|
||||
, invertscroll : false // Enable mobile invert style scrolling
|
||||
, onMove : function(){}
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -59,13 +60,15 @@
|
|||
, iScroll = 0
|
||||
, iPosition = { start: 0, now: 0 }
|
||||
, iMouse = {}
|
||||
, touchEvents = ( 'ontouchstart' in document.documentElement ) ? true : false
|
||||
, touchEvents = 'ontouchstart' in document.documentElement
|
||||
, UA = $.browser
|
||||
;
|
||||
|
||||
function initialize()
|
||||
{
|
||||
oSelf.update();
|
||||
setEvents();
|
||||
|
||||
return oSelf;
|
||||
}
|
||||
|
||||
|
@ -124,6 +127,9 @@
|
|||
{
|
||||
oWrapper[0].addEventListener( 'DOMMouseScroll', wheel, false );
|
||||
oWrapper[0].addEventListener( 'mousewheel', wheel, false );
|
||||
oWrapper[0].addEventListener( 'MozMousePixelScroll', function( event ){
|
||||
event.preventDefault();
|
||||
}, false);
|
||||
}
|
||||
else if( options.scroll )
|
||||
{
|
||||
|
@ -133,6 +139,16 @@
|
|||
|
||||
function start( event )
|
||||
{
|
||||
$( "body" ).addClass( "noSelect" );
|
||||
// Disable select text under IE10
|
||||
if ( UA.msie < 10 ){
|
||||
$( "body" ).attr({
|
||||
"onselectstart": "return false",
|
||||
"ondragstart": "return false"
|
||||
});
|
||||
}
|
||||
oScrollbar.obj.addClass( "dragging" );
|
||||
|
||||
var oThumbDir = parseInt( oThumb.obj.css( sDirection ), 10 );
|
||||
iMouse.start = sAxis ? event.pageX : event.pageY;
|
||||
iPosition.start = oThumbDir == 'auto' ? 0 : oThumbDir;
|
||||
|
@ -181,13 +197,13 @@
|
|||
{
|
||||
if( oContent.ratio < 1 )
|
||||
{
|
||||
if( ! touchEvents )
|
||||
if( options.invertscroll && touchEvents )
|
||||
{
|
||||
iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( ( sAxis ? event.pageX : event.pageY ) - iMouse.start))));
|
||||
iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( iMouse.start - ( sAxis ? event.pageX : event.pageY ) ))));
|
||||
}
|
||||
else
|
||||
{
|
||||
iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( iMouse.start - ( sAxis ? event.pageX : event.pageY ) ))));
|
||||
iPosition.now = Math.min( ( oTrack[ options.axis ] - oThumb[ options.axis ] ), Math.max( 0, ( iPosition.start + ( ( sAxis ? event.pageX : event.pageY ) - iMouse.start))));
|
||||
}
|
||||
|
||||
iScroll = iPosition.now * oScrollbar.ratio;
|
||||
|
@ -198,6 +214,12 @@
|
|||
|
||||
function end()
|
||||
{
|
||||
$( "body" ).removeClass( "noSelect" );
|
||||
// Enable select text under IE10
|
||||
if ( UA.msie < 10 ){
|
||||
$( "body" ).removeAttr( "onselectstart", "ondragstart" );
|
||||
}
|
||||
oScrollbar.obj.removeClass( "dragging" );
|
||||
$( document ).unbind( 'mousemove', drag );
|
||||
$( document ).unbind( 'mouseup', end );
|
||||
oThumb.obj.unbind( 'mouseup', end );
|
||||
|
|
|
@ -364,6 +364,14 @@
|
|||
height: 6px;
|
||||
width: 6px;
|
||||
}
|
||||
.noSelect {
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
.tinycanvas .scrollbar {
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
|
@ -373,6 +381,10 @@
|
|||
-moz-transition: opacity 0.3s ease;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
.tinycanvas .scrollbar.dragging {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
.tinycanvas .scrollbar.sb_h {
|
||||
left: 0;
|
||||
bottom: -6px;
|
||||
|
|
|
@ -276,7 +276,7 @@ a:focus { outline: none; }
|
|||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
z-index: 12;
|
||||
}
|
||||
#orbitdiag .tile { background-color: #000; }
|
||||
.diag_holder { background-color: #000; }
|
||||
|
@ -374,6 +374,9 @@ a:focus { outline: none; }
|
|||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
.widget.gs_w {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
/* header drop menu */
|
||||
.sdm_mdr .sdm_o { top: 36px; }
|
||||
|
@ -699,7 +702,7 @@ a:focus { outline: none; }
|
|||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 9;
|
||||
z-index: 12;
|
||||
}
|
||||
.app_frame .app_holder {
|
||||
background-color: #fff;
|
||||
|
|
|
@ -85,8 +85,8 @@
|
|||
<div class="diag_holder_inner">
|
||||
<div class="diag_message"></div>
|
||||
<div class="diag_action">
|
||||
<a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
|
||||
<a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
|
||||
<a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
|
||||
<a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -81,8 +81,8 @@
|
|||
<div class="diag_holder_inner">
|
||||
<div class="diag_message"></div>
|
||||
<div class="diag_action">
|
||||
<a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
|
||||
<a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh2 hp" onclick="return false;"></a>
|
||||
<a href="" id="diag_confirm" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
|
||||
<a href="" id="diag_cancel" class="diag_btn admbg admtxt w1 hh1 hp" onclick="return false;"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Reference in New Issue