当您安装此 Greasemonkey 脚本并访问 google.com 时,您可以将框拖到 google 徽标上。但是您不能将其拖到谷歌搜索编辑字段上。你怎样才能让这个盒子位于顶部并覆盖目标网站的每个元素?
// ==UserScript==
// @name Draggable Box
// @namespace http://userscripts.org/users/23652
// @description Draggable Box example
// @include http://*
// @include https://*
// @include file://*
// @copyright JoeSimmons
// @version 1.0.1
// @license Creative Commons Attribution-Noncommercial 3.0 United States License
// ==/UserScript==
// OPTIONS ///////////////////////////////////////////////////////////////
var box_style = 'border:4px ridge #0099FF; background:#BFE6FF; color:#000; padding:16px; width:100px; height:14px; text-align:center; cursor:move;';
//////////////////////////////////////////////////////////////////////////
function dragStart(e) {
dragObj.elNode = e.target;
if (dragObj.elNode.nodeType == 3) dragObj.elNode = dragObj.elNode.parentNode;
dragObj.cursorStartX = e.clientX + window.scrollX;
dragObj.cursorStartY = e.clientY + window.scrollY;
dragObj.elStartLeft = parseInt(dragObj.elNode.style.left, 10);
dragObj.elStartTop = parseInt(dragObj.elNode.style.top, 10);
dragObj.elNode.style.zIndex = ++dragObj.zIndex;
document.addEventListener("mousemove", dragGo, true);
document.addEventListener("mouseup", dragStop, true);
e.preventDefault();
}
function dragGo(e) {
e.preventDefault();
var x = e.clientX + window.scrollX,
y = e.clientY + window.scrollY;
dragObj.elNode.style.left = (dragObj.elStartLeft + x - dragObj.cursorStartX) + "px";
dragObj.elNode.style.top = (dragObj.elStartTop + y - dragObj.cursorStartY) + "px";
}
function dragStop(e) {
document.removeEventListener("mousemove", dragGo, true);
document.removeEventListener("mouseup", dragStop, true);
}
var dragObj = new Object(), x, y;
dragObj.zIndex = 0;
var div = document.createElement('div');
div.textContent = 'Draggable Box';
div.setAttribute('id', 'draggable_box');
div.setAttribute('style', 'z-index:99; position:fixed; top:'+((window.innerHeight/2)-50)+'px; left:'+((window.innerWidth/2)-50)+'px; -moz-border-radius:6px; '+(box_style?box_style:''));
div.addEventListener('mousedown', function(e){dragStart(e);}, false);
document.body.insertBefore(div, document.body.firstChild);