☰

Smoothscroll

Smooth scrolling on pages using javascript and jquery

当前为 2014-12-26 提交的版本，查看 最新版本。

// ==UserScript==
// @name Smoothscroll
// @include     http*
// @author       Creec Winceptor
// @description  Smooth scrolling on pages using javascript and jquery
// @namespace https://greasyfork.org/users/3167
// @require       http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
// @grant none

// @version 0.0.1.20141226011714
// ==/UserScript==


//SETTINGS HERE

//Refreshrate setting (affects rate at which scrolling is refreshed) 
//values: 1-1000 (just leave it 100)
var refreshrate = 100;

//Smoothness value (how strong the smoothing effect is)
//values: 1-100
var smoothness = 65;



//CODE STARTS HERE
this.$ = this.jQuery = jQuery.noConflict(true);

if (window.top != window.self)  //don't run on frames or iframes
    return;

var animationduration = Math.round(1000/refreshrate);
var relativeratio = Math.round(101-smoothness)/100;
var relativeratio = relativeratio*relativeratio;

var startposition = false;
var targetposition = 0;
var position = 0;

var focus = $('body');


(function($) {
    $.fn.has_scrollbar = function() {
        var divnode = this.get(0);
        if(divnode.scrollHeight > divnode.clientHeight)
            return true;
    }
})(jQuery);

function UpdatePosition1()
{
	var relative = position - document.body.scrollTop;
	
	if (Math.abs(relative*relativeratio)<= 1 )
		{
			startposition = false;
			targetposition = 0;
			$('body').stop();
			$('body').animate({
		scrollTop: '+=' + Math.round(relative)
	}, animationduration, "linear")
		}
	else
		{
			$('body').stop();
				$('body').animate({
		scrollTop: '+=' + relative*relativeratio
	}, animationduration, "linear", UpdatePosition)
		}
}

function UpdatePosition(element)
{
	var relative = position - $(element).scrollTop();
	//$(element).css( "border", "3px solid red" );
	//console.log("relative:" + relative);
	if (Math.abs(relative)<= 1 )
		{
			startposition = false;
			targetposition = 0;
			$(element).animate({
		scrollTop: '+=' + Math.round(relative)
		}, animationduration, "linear")
	}
	else
	{
		$(element).stop();
		$(element).animate({
				scrollTop: '+=' + relative*relativeratio
			}, animationduration, "linear", function() {UpdatePosition(element);}
		)
	}
}


function getscrollable(element)
{
	var parentelement = $(element).parent();
	if ( $(parentelement))
	{
		if ( $(parentelement).height() < $(element).height())
			{
				return $(element);
			}
		else
			{
				return getscrollable( $(element));
			}
		
	}
	else
	{
		return $('body');
	}
}

 function MouseScroll (event) {
	 //var parentelement = $(focus).parent();
	 if ($(focus).is("textarea"))
		 {
			 return false;
		 }
	 else
		 {
			if ( !$(focus).has_scrollbar())
			{
				focus = $('body');
			}
		 }

	 var rolled = 0;
	 
	 if (!startposition)
		 {
			startposition = $(focus).scrollTop();
			 //console.log("start:" + startposition);
		 }
	 
	 if ('wheelDelta' in event) {
		 rolled = event.wheelDelta;
	 }
	 else {  // Firefox
		 // The measurement units of the detail and wheelDelta properties are different.
		 rolled = event.detail*(-120);
	 }
	 targetposition = targetposition - rolled;
	 //console.log("target:" + targetposition);
	
	 var maxposition = $(focus).height()-window.innerHeight;
	 if (targetposition+startposition <= 0)
		 {
			 targetposition = -startposition;
			 //console.log("start")
		 }
	 
	 else if (targetposition+startposition >= maxposition)
		 {
			 targetposition = (maxposition-startposition);
			 //console.log("end")
		 }
	 else
		 {
			 
		 }
	 //console.log("document:" + $(document).height());
	 //console.log("window:" + $(window).height());
	 position = startposition + targetposition;
	 
	 UpdatePosition($(focus));
	 //element.innerHTML = "";
	 console.log("pos:" + position);
	 event.preventDefault();
	 return false;
 	}

	function Init (smoothscrollelem) {
		
		// for mouse scrolling in Firefox
		
		
		if (smoothscrollelem.addEventListener) {    // all browsers except IE before version 9
			// Internet Explorer, Opera, Google Chrome and Safari
			smoothscrollelem.addEventListener ("mousewheel", MouseScroll, false);
			// Firefox
			smoothscrollelem.addEventListener ("DOMMouseScroll", MouseScroll, false);
		}
		else {
			if (smoothscrollelem.attachEvent) { // IE before version 9
				smoothscrollelem.attachEvent ("onmousewheel", MouseScroll);
			}
		}
    }

	var elements = $('*');
	console.log("Loaded " + elements.length + " scrollable elements.");
	$(elements).each(function() {
		//if (this.scrollTop > this.height())
		//if ($(this).innerHeight()>$(this).outerHeight())
		//{
			//Init(window);
			//$(this).bind('mousewheel', function(e){
				//MouseScroll(e.originalEvent, this);
				//console.log("scrolling");
				//if(e.originalEvent.wheelDelta /120 > 0) {
				//$(this).text('scrolling up !');
				//}
				//else{
				//$(this).text('scrolling down !');
				//}
			//});
		//}
		$( this ).bind({
		  mouseenter: function() {
			  focus = $(this);

			// Do something on click
		  },
		  mouseleave: function() {
			  focus = $('body');
			  
		  }
		});
	});

			$('body').bind('mousewheel', function(e){
				MouseScroll(e.originalEvent);
				//console.log("scrolling");
				//if(e.originalEvent.wheelDelta /120 > 0) {
				//$(this).text('scrolling up !');
				//}
				//else{
				//$(this).text('scrolling down !');
				//}
			});


//Init(window);																																				 
console.log("Smoothscroll loaded!");