油猴的这个滚动脚本，可否让其“左侧通行”？？？？？？？？？？

楼主^#

更多发布于：2011-08-28 16:58

问题来自于这个油猴脚本
http://userscripts.org/scripts/review/65196

Scroll with Mouse Plus|滚动无需点击

作用是鼠标放到右侧滚动条上之后可以随着鼠标的移动而自行上下翻页无需点击

经过长时间审慎地使用，我发现一个很严肃的问题

就是按照正常人持握鼠标的姿势大部分时间鼠标方向是斜对着前方左侧
而中文的阅读顺序又是从左至右
大部分网站的文字也都是从左侧开始对齐的
这就导致了大部分时间鼠标也一样是在屏幕的左半部分游离，
也就是说如果滚动条能相适应的放在页面的左侧用户挪动鼠标到滚动条上要走的“路途” 总是要比默认放在右侧短一些
(不要小看的这短短的距离，我记着曾经一个帖子看过 safari的下拉式菜单就是同时上下两个方向延展的，这样方便用户无论选择哪个选项鼠标都行走最短的距离)

而且本身鼠标就是向左侧倾斜顺着鼠标的方向行走就是顺着手腕关节行走这样也能符合人体工程~
不过我想到的自然别人也早就想到啦

mozilla已经提供了滚动栏左侧放置的选项
https://www.firefox.net.cn/forum/viewtopic.php?p=200622

现在我想让这个脚本是不是也能相应的改成让鼠标放在屏幕左侧时候激活滚动无须点击
代码如下

// ==UserScript==
// @name           Scroll with Mouse Plus
// @namespace      http://userscripts.org/users/86496
// @description    Scroll a page by simply moving the cursor up and down, without even a click!
// @include        *
// @author         hzhbest
// @date           12/Jan/2010
// @version        1.16
// ==/UserScript==

// Original script by Protector one (http://userscripts.org/scripts/show/63593)
// hzhbest modded; -algorithm changed -compatibility improved -flexabiligy:move into the scrollbar to activate and continue scrolling while in the scroll-sensitive zone

(function(){

//###Customization: |可自定义的东西：
  
  //Show the scrolling indicator box or not, "1" to show. | 1－显示提示条，其他－不显示。
var scrollShowIndicator = 1;

  //Set the width of scroll-sensitive zone, "100" as full width, "10" as one tenth.
  // | “滚动触发区”宽度，区间：[0-100]，100为屏宽，0为禁用，10为十分之一屏宽。
var VScrollonWidth = 10;

  //Set the background of the indicator bar. | 提示条的背景，可以为“rgba()”带透明色式或“#xxxxxx”实颜色式或其他。
var IndicBarBG = "rgba(29,163,63,.4)"

  //Set the height of "thickness" of the indicator bar. | 提示条的粗细度，单位为像素。
var IndicBarH = 20;

  //Write here the width of the scrollbar (set in display properties) for highest accuracy.
  // | 在下面填写滚动条的宽度（也就是系统“显示属性”中的数字），这样能实现最高精确度。
var ScrollbarWidth = 15;

  //Set a trigger for activation, 1-none, 2-Ctrl key, 3-middle 100px range.
  // | 在下面设置激活条件，1－无，2－按住 Ctrl 键，3－鼠标在页面中间100像素高度范围内。
var activateCond = 1;


//###Customization ends. 请不要更改下面代码。
var scrollStartSWTM = -1;

var factor;
var b=0;
var VScrollOn=0;

	document.addEventListener('mousemove',function(event){
		var dheightMax = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
		var cwidthMax = Math.max(document.body.clientWidth, document.documentElement.clientWidth);
		var cwinHeight = window.innerHeight;
		var scrollboxHeight = window.innerHeight - 2*ScrollbarWidth
		if(dheightMax > cwinHeight){
			if (event.clientX > cwidthMax)
				switch(activateCond){
					case 1:
						VScrollOn = 1;
						break;
					case 2:
						if(event.ctrlKey)VScrollOn = 1;
						break;
					case 3:
						if(event.clientY>cwinHeight/2-50 && event.clientY<cwinHeight/2+50)VScrollOn = 1;
				};
			if (event.clientX < ((1-VScrollonWidth/100) * cwidthMax))VScrollOn = 0;
			if (document.body.contentEditable == "true")VScrollOn = 0;
		}
		if (VScrollOn){
			if (scrollShowIndicator == 1)make_boxes();
			if (scrollStartSWTM != -1){
				factor = (event.ctrlKey) ? dheightMax / scrollboxHeight / 2 : dheightMax / scrollboxHeight;
				if (b){b.style.top = (event.clientY - IndicBarH/2) + 'px';}
				var delta = factor * (event.clientY - scrollStartSWTM);
				document.body.scrollTop += delta;
				document.documentElement.scrollTop += delta;
				if(event.clientY + 20 > cwinHeight){
					document.body.scrollTop += (factor * 10);
					document.documentElement.scrollTop += (factor * 10);
				}
				if(event.clientY > 0 && event.clientY < 20){
					document.body.scrollTop -= (factor * 10);
					document.documentElement.scrollTop -= (factor * 10);
				}
			}
		scrollStartSWTM = event.clientY;
		}else
		{
			scrollStartSWTM = -1;
			if (b) setTimeout(function(){b.style.top = -200 + 'px';},200);
		}
	},false);
	document.addEventListener('click',function(){VScrollOn=0;},false);

			
    function make_boxes() {
        if (!b) {
            b = document.createElement("div");
            b.setAttribute("id","IndicatorBox");
            b.setAttribute("style", "width:" + VScrollonWidth +"%;background:" + IndicBarBG + ";min-height:" +IndicBarH + "px;text-align:center;position: fixed; top: -40px; right: 0;overflow: hidden; z-index: 10005;font-family:Arial !important;cursor:n-resize;cursor:ns-resize;");
            document.body.appendChild(b);
			b.addEventListener('click',function(){VScrollOn=0;},false);
            return true;
        }
	}

})();

一开始我看到里面有个right 改成left之后发现只是那个绿色的指示条挪到了左侧实际上还是在右侧激活~~~~
哪位大大有兴趣帮忙改一下代码发上来吧啦~~~~应该不是很困难，只是我太笨

如果有兴趣的话大家也可以试试滚动栏放在左边时间长了就会体会出方便了 ~~~

并且看起来还很拉风哈~~ <img src="{SMILIES_PATH}/icon_cool.gif" alt="8)" title="Cool" />

喜欢0

SoIN

小狐狸

UID35408
注册日期2011-03-08
最后登录2014-02-14
发帖数82
经验12枚
威望0点
贡献值0点
好评度0点

加关注写私信

1楼^#

发布于：2011-08-28 16:58

改完…基本上有测试过，至少我是没有看到BUG…，所以应该是没问题的吧

// ==UserScript==
// @name           Scroll with Mouse Plus
// @namespace      http://userscripts.org/users/86496
// @description    Scroll a page by simply moving the cursor up and down, without even a click!
// @include        *
// @author         hzhbest
// @date           12/Jan/2010
// @version        1.16
// ==/UserScript==

// Original script by Protector one (http://userscripts.org/scripts/show/63593)
// hzhbest modded; -algorithm changed -compatibility improved -flexabiligy:move into the scrollbar to activate and continue scrolling while in the scroll-sensitive zone

(function(){

//###Customization: |可自定义的东西：
	
	//Show the scrolling indicator box or not, "1" to show. | 1－显示提示条，其他－不显示。
var scrollShowIndicator = 1;

	//Set the width of scroll-sensitive zone, "100" as full width, "10" as one tenth.
	// | “滚动触发区”宽度，区间：[0-100]，100为屏宽，0为禁用，10为十分之一屏宽。
var VScrollonWidth = 10;

	//Set the background of the indicator bar. | 提示条的背景，可以为“rgba()”带透明色式或“#xxxxxx”实颜色式或其他。
var IndicBarBG = "rgba(29,163,63,.4)"

	//Set the height of "thickness" of the indicator bar. | 提示条的粗细度，单位为像素。
var IndicBarH = 20;

	//Write here the width of the scrollbar (set in display properties) for highest accuracy.
	// | 在下面填写滚动条的宽度（也就是系统“显示属性”中的数字），这样能实现最高精确度。
var ScrollbarWidth = 15;

	//Set a trigger for activation, 1-none, 2-Ctrl key, 3-middle 100px range.
	// | 在下面设置激活条件，1－无，2－按住 Ctrl 键，3－鼠标在页面中间100像素高度范围内。
var activateCond = 1;


//###Customization ends. 请不要更改下面代码。
var scrollStartSWTM = -1;

var factor;
var b=0;
var VScrollOn=0;

	document.addEventListener('mousemove',function(event){
		var dheightMax = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
		var cwidthMax = Math.max(document.body.clientWidth, document.documentElement.clientWidth);
		var cwidthMin = parseInt(window.innerWidth-document.body.clientWidth);
		var cwinHeight = window.innerHeight;
		var scrollboxHeight = window.innerHeight - 2*ScrollbarWidth
		if(dheightMax > cwinHeight){
			if (event.clientX < cwidthMin)
				switch(activateCond){
					case 1:
						VScrollOn = 1;
						break;
					case 2:
						if(event.ctrlKey)VScrollOn = 1;
						break;
					case 3:
						if(event.clientY>cwinHeight/2-50 && event.clientY<cwinHeight/2+50)VScrollOn = 1;
				};
			if (event.clientX > (cwidthMin+(VScrollonWidth/100) * cwidthMax))VScrollOn = 0;
			if (document.body.contentEditable == "true")VScrollOn = 0;
		}
		if (VScrollOn){
			if (scrollShowIndicator == 1)make_boxes();
			if (scrollStartSWTM != -1){
				factor = (event.ctrlKey) ? dheightMax / scrollboxHeight / 2 : dheightMax / scrollboxHeight;
				if (b){b.style.top = (event.clientY - IndicBarH/2) + 'px';}
				var delta = factor * (event.clientY - scrollStartSWTM);
				document.body.scrollTop += delta;
				document.documentElement.scrollTop += delta;
				if(event.clientY + 20 > cwinHeight){
					document.body.scrollTop += (factor * 10);
					document.documentElement.scrollTop += (factor * 10);
				}
				if(event.clientY > 0 && event.clientY < 20){
					document.body.scrollTop -= (factor * 10);
					document.documentElement.scrollTop -= (factor * 10);
				}
			}
			scrollStartSWTM = event.clientY;
		}
		else{
			scrollStartSWTM = -1;
			if (b) setTimeout(function(){b.style.top = -200 + 'px';},200);
		}
	},false);
	document.addEventListener('click',function(){VScrollOn=0;},false);


	function make_boxes() {
		if (!b) {
			b = document.createElement("div");
			b.setAttribute("id","IndicatorBox");
			b.setAttribute("style", "width:" + VScrollonWidth +"%;background:" + IndicBarBG + ";min-height:" +IndicBarH + "px;text-align:center;position: fixed; top: -40px; left: "+ScrollbarWidth+"px;overflow: hidden; z-index: 10005;font-family:Arial !important;cursor:n-resize;cursor:ns-resize;");
			document.body.appendChild(b);
			b.addEventListener('click',function(){VScrollOn=0;},false);
			return true;
		}
	}

})();

回复喜欢

怒放小狐狸 UID32454 注册日期2010-04-02 最后登录2013-12-10 发帖数24 经验11枚威望0点贡献值0点好评度0点加关注写私信	2楼^# 发布于：2011-08-28 16:58 这样还是要不停上下移动鼠标，翻页时视线离开阅读焦点。推荐用back to top扩展，自定义按钮右键下翻页，左键上翻页，中键关闭当前标签页。这样的话，鼠标只停在按钮上，在打开多个网页浏览时，鼠标基本保持不动，可以大大增加阅读的流畅。
	回复(0) 喜欢(0)

imidway 小狐狸 UID37084 注册日期2011-08-26 最后登录2021-11-25 发帖数28 经验43枚威望0点贡献值34点好评度2点加关注写私信	3楼^# 发布于：2011-08-28 16:58 wow wow~ 多谢SoIn~~问题完美解决~~~ 现在鼠标上下撸来撸去很是奔放~~~ 怒放推荐的插件试用了一下也不错 ~纳入囊中~~~多谢你们啦~~ ^^
	回复(0) 喜欢(0)

您需要登录后才可以回帖，登录或者注册

油猴的这个滚动脚本，可否让其“左侧通行”？？？？？？？？？？

最新喜欢：