Userscript适用于Chrome上的Tampermonkey，但不适用于Firefox上的Greasemonkey
Userscript works in Tampermonkey on Chrome but not in Greasemonkey on Firefox
我已经在Firefox上使用Greasemonkey和Chrome上使用Tampermonkey的用户脚本超过一年半了。它在每个网页上添加了一个滚动到顶部按钮。我试着添加另一个网站，包括在Greasemonkey，但后来似乎已经打破了它。现在，滚动到顶部按钮不会出现在Firefox的任何网站上，但完全相同的用户脚本在Chrome上的Tampermonkey上没有问题。我没有创建这个脚本。我在userscripts。org网站倒闭前找到的。下面是脚本。有人知道什么可能需要在脚本中进行更改，使其与Greasemonkey兼容吗?
我使用Firefox 41.0的xUbuntu和Greasemonkey 3.4.1。我的Chrome浏览器是45.0.2454.101和Tampermonkey 3.11。
// ==UserScript==
// @name Scroll To Top Button
// @version v1.3.2
// @include http://*
// @include https://*
// ==/UserScript==
(function(global) {
if(global !== window) return;
function _(id) {
return document.getElementById(id);
}
function bind(context, name) {
return function() {
return context[name].apply(context, arguments);
}
}
global.addEventListener('scroll', scrollHandler, false);
function scrollHandler() {
!scroll.isScrolling && ((scroll.getScrollY() > 0) ? scroll.showBtn() : scroll.hideBtn());
}
var scroll = {
__scrollY : 0,
isScrolling : false, //is scrolling
imgBtn : null,
isBtnShow : false,
pageHeight : 0,
speed : 0.75,
init : function() {
var document = global.document,
div = document.createElement('div'),
css;
css = '#__scrollToTop{font:12px/1em Arial,Helvetica,sans-serif;margin:0;padding:0;position:fixed;display:none;left:92%;top:80%;text-align:center;z-index:999999; width:74px;height:50px;' +
'cursor:pointer;opacity:0.5;padding:2px;}' +
'#__scrollToTop:hover{opacity:1;}' +
'#__scrollToTop span.__scroll__arrow{ position:relative;top:20px;background:none repeat scroll 0 0 #eee;border-style:solid; border-width:1px;' +
'border-color:#ccc #ccc #aaa; border-radius:5px;color:#333;font-size:36px;padding:5px 8px 2px;}' +
' #__scroll__scroll{height:50px;width:50px;float:left;z-index:100001;position:absolute;} ' +
'#__scroll__util{font:12px/1em Arial,Helvetica,sans-serif;text-align:center;height:44px;width:20px;float:right;position:absolute;left:54px;z-index:100000; ' +
'border-style:solid; border-width:1px;border-color:#ccc #ccc #aaa; border-radius:2px;top:5px;display:none;}' +
'#__scroll__util span{display:block;height:18px;padding-top:4px;text-align:center;text-shadow:2px 2px 2px #888;font-size:16px;} ' +
'#__scroll__util span:hover{background-color: #fc9822;}';
GM_addStyle(css);
div.id = '__scrollToTop';
div.title = 'Back To Top';
div.innerHTML = '<div id="__scroll__scroll">' +
'<span class="__scroll__arrow">▲</span>' +
'</div>' +
'<div id="__scroll__util">' +
'<span name="__hide" title="Hide the Button">x</span>' +
'<span name="__bottom" title="Scroll to the bottom">▼</span>' +
'</div>';
document.body.appendChild(div);
div.addEventListener('mousedown', bind(this, 'control'),false);
div.addEventListener('mouseover', bind(this, 'showUtil'),false);
div.addEventListener('mouseout', bind(this, 'hideUtil'),false);
this.util = _('__scroll__util');
this.pageUtil = _('__scroll__page');
this.pageHeight = document.body.scrollHeight;
return this.imgBtn = div;
},
getImgBtn : function() {
return this.imgBtn || this.init();
},
show : function(elem) {
elem.style.display = 'block';
},
hide : function(elem) {
elem.style.display = 'none';
},
showBtn : function() {
if(this.isBtnShow) return;
this.isBtnShow = true;
this.show(this.getImgBtn());
},
hideBtn : function() {
if(!this.isBtnShow) return;
this.isBtnShow = false;
this.hide(this.getImgBtn());
},
getScrollY : function() {
//this piece of code is from John Resig's book 'Pro JavaScript Techniques'
var de = document.documentElement;
return this.__scrollY = (self.pageYOffset ||
( de && de.scrollTop ) ||
document.body.scrollTop);
},
closeBtn : function(event) {
event.preventDefault();
event.stopPropagation();
this.hideBtn();
window.removeEventListener('scroll', scrollHandler, false);
},
showUtil : function() {
this.show(this.util);
},
hideUtil : function() {
this.hide(this.util);
},
scroll : function() {
if(!this.isScrolling) {
this.isScrolling = true;
}
var isStop = false,
scrollY = this.__scrollY;
if(this.direction === 'top') {
isStop = scrollY > 0;
this.__scrollY = Math.floor(scrollY * this.speed);
} else {
isStop = scrollY < this.pageHeight;
this.__scrollY += Math.ceil((this.pageHeight - scrollY) * (1 - this.speed)) + 10;
}
this.isScrolling = isStop;
window.scrollTo(0, this.__scrollY);
isStop ? setTimeout(bind(scroll, 'scroll'), 20) : (this.direction === 'top' && this.hideBtn());
},
control : function(e) {
var t = e.target, name = t.getAttribute('name');
switch(name) {
case '__bottom':
this.scrollToBottom();
break;
case '__hide' :
this.closeBtn(e);
break;
default :
this.scrollToTop();
break;
}
},
scrollToTop : function() {
this.direction = 'top';
this.scroll();
},
scrollToBottom : function() {
this.direction = 'bottom';
var bodyHeight = global.document.body.scrollHeight,
documentElementHeight = global.document.documentElement.scrollHeight;
this.pageHeight = Math.max(bodyHeight, documentElementHeight);
this.scroll();
}
};
//Autoscroll
(function() {
var isAutoScroll = false;
var autoScroll = {
__autoScrollID : 0,
isAutoScroll : false,
defaultSpeed : 1,
currentSpeed : 1,
intervalTime : 100,
reset : function() {
this.isAutoScroll && (this.currentSpeed = this.defaultSpeed);
},
startOrStop : function() {
var that = this;
if(that.isAutoScroll) {
that.isAutoScroll = false;
clearInterval(that.__autoScrollID);
} else {
that.isAutoScroll = true;
that.__autoScrollID = setInterval(function() {
global.scrollBy(0, that.currentSpeed);
}, that.intervalTime);
}
},
fast : function() {
this.isAutoScroll && this.currentSpeed <= 10 && this.currentSpeed++;
},
slow : function() {
this.isAutoScroll && this.currentSpeed > 1 && this.currentSpeed--;
},
keyControl : function(e) {
if(e.target != global.document.body && e.target != global.document.documentElement) return false; // only when the cursor focus on the page rather than the input area can trigger this event.
var charCode = e.charCode,
key = this.keyMap[charCode];
key && this[key]();
},
keyMap : {
'100' : 'slow', // press 'd', slow the speed of the scroll
'102' : 'fast', // press 'f', speed scroll
'114' : 'reset', // press 'r', reset the autoscroll's speed
'115' : 'startOrStop' //when you click 's' at the first time, the autoscroll is begin, and then you click again, it will stop.
}
};
global.addEventListener('keypress', bind(autoScroll, 'keyControl'), false);
}())
}(window.top))
在// ==/UserScript==之前加一行:
// @grant GM_addStyle
实际上我很惊讶直到现在它还能工作，因为Greasemonkey需要@grant超过一年。
相关文章：
- PHP中的setcookie仅适用于localhost
- 将文本框中的值用于按钮窗体操作上的变量
- 提供“;onClick"适用于iPad(触摸屏）和桌面用户的默认功能
- SQLite插件适用于Mac和Windows，但不适用于手机上的Safari
- 画布上的自定义字体仅适用于safari
- 将脚本应用于Angular 2上的输入
- JS适用于Firefox和Safari，但不适用于Chrome.此处'是我的网站
- 在Android上使用PhoneGap的地理位置仅适用于index.html
- 动态选择列表上的单击事件仅适用于 FF
- 使用适用于 JavaScript 的 ArcGIS API 在地图上显示 KMZ 图层的各个图层
- 在上传之前在页面上预览图像，它适用于除IE之外的所有浏览器
- 字体在Safari上出现了很棒的链接问题，适用于Chrome和Firefox
- 简单的Javascript重定向适用于localhost测试，而不适用于上传的站点
- 苹果取消了直播shoutcast&ios 6上的icecast仅适用于web应用程序
- Userscript适用于Chrome上的Tampermonkey，但不适用于Firefox上的Greasemonkey
- 在OSX Safari(适用于Chrome/Firefox)上，滚动事件期间的CSS定位无响应和抖动
- innerHTML写上.value适用于IE9 IE8，但不适用于IE10, Firefox, Chrome
- 在用户定义的变量上获得selecteindex -适用于IE而不是Firefox
- event.ctrlKey适用于IE和Chrome，但不适用于legendItemClick上的Firefox
- IE上的JQuery问题…适用于firefox
