我想使用别人的网页向我的朋友展示一个概念。如何在某人的网页上添加自己的图层?Greasemonkey会工作吗?
问问题
188 次
3 回答
1
是的,Greasemonkey 可以通过添加(或删除或更改)页面 DOM 元素来做到这一点。
这是一个“添加层”到 Stack Overflow 页面的启动脚本:
// ==UserScript==
// @name _Add a "layer" to a webpage
// @namespace Stack Overflow
// @include http://stackoverflow.com/*
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// ==/UserScript==
$("body").prepend (
'<div id="gmLayerWrapper">'
+ '<p>All your overflow are belong to us.<br>'
+ '<img src="http://2.bp.blogspot.com/-hEJb82Ni7V8/TrnNc8Ljj3I/AAAAAAAABG4/Ow2GnJyDo74/s400/UnicornRainbow.jpg"'
+ ' alt="They\'re everywhere!">'
+ '</p>'
+ '<div id="gmTransparentFilm"></div>'
+ '</div>'
);
$("#gmLayerWrapper").width ( $(window).width () )
.height ( $(window).height () )
;
//--- Fudge our text width for aesthetics.
$("#gmLayerWrapper p").width ( $(window).width () / 2 )
GM_addStyle ( (<><![CDATA[
#gmLayerWrapper {
margin: 0;
padding: 0;
position: fixed;
top: 0;
left: 0;
min-width: 200px;
}
#gmTransparentFilm {
margin: 0;
padding: 0;
background: red;
opacity: 0.7;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 666;
}
#gmLayerWrapper p {
padding: 0.5em 1.5em;
margin: 1em auto;
background: white;
border-radius: 2em;
font-size: 30px;
line-height: 2.5;
text-align: center;
vertical-align: middle;
min-width: 4em;
position: relative; /*Required for z-index*/
z-index: 888;
}
]]></>).toString () );
它用:
来实现这一点。
于 2012-05-08T02:30:24.023 回答
1
你可以用greasemonkey做到这一点。您将不得不再创建一个div
s 与正确的z-index
, 和 要么position:fixed
要么position:absolute
。
于 2012-05-07T14:00:17.350 回答
0
可能最简单的方法是File -> Save As
自己工作并编辑生成的文件。您可以创建一个 GreaseMonkey 脚本来动态执行此操作,但对于快速 hi-5 来说,这听起来需要做很多工作。
于 2012-05-07T14:10:10.647 回答