📄 main.html
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<meta name="description" content="Page Design">
<meta name="keywords" content="">
<meta name="author" content="SadEmperor">
<meta name="generator" content="SNC">
<style type="text/css">
td{
font-size:10pt;
color:#000000;
}
div{
font-size:10pt;
}
.usualDiv{
position:absolute;
border:1px dotted #333333;
background-color:#eeeeee;
z-index:2;
}
.focusOn{
position:absolute;
border:2px solid #000000;
background-color:#ffffe0;
z-index:2;
}
.cs{
display:none;
position:absolute;
z-index:98;
}
</style>
<script language="javascript">
//全局变量定义
var oTool;
var drawing=false;
var ix;
var ipointerX;
var step;
var styBorder,styBg;
var oo;
//显示工具箱
function document.ondblclick()
{
if(sysStatus=="ready"){
step=15;
ipointerX=event.x;
oTool.style.top=event.y;
oTool.style.display="block";
fMoveToolbox();
}
return;
}
//移动工具箱到鼠标指针位置
function fMoveToolbox()
{
var iPosdiff=ix-ipointerX;
if(Math.abs (iPosdiff)<30) step=1;
if(iPosdiff<0){
oTool.style.left = parseInt(oTool.style.left) + step;
ix=parseInt(oTool.style.left);
sys_status.innerHTML=ix+"|"+ipointerX;
setTimeout("fMoveToolbox()",1)
}
else{
if(iPosdiff>0){
oTool.style.left=parseInt(oTool.style.left)-step;
ix=parseInt(oTool.style.left)
sys_status.innerHTML =ix+"|"+ipointerX;
setTimeout("fMoveToolbox()",1);
}
}
}
//在指定位置显示必要的调试信息（与系统功能无关）
function debug(msg)
{
sys_status.innerHTML =msg;
}
//系统功能函数
function window.onload()
{
//private variable
var el=document.body;
var divid;
var oldx=0,oldy=0;
//Initialize
ix=0;
ipointerX=0;
sysStatus="ready";
styBorder="1px dotted #333333";
styBg="#eeeeee";
oTool=document.getElementById("sys_toolbox");
el.attachEvent("onmousedown",function(){
if(event.ctrlKey){
drawing=true;
oo=createDiv();
oldx=event.x+el.scrollLeft;
oldy=event.y+el.scrollTop;
//el.setCapture();
}
});
el.attachEvent("onmouseup",function(){
if (!drawing) return;
if(drawing&&event.ctrlKey){
//el.releaseCapture();
drawing=false;
align(oo);
}
});
el.attachEvent("onmousemove",function(){
if (!drawing) return;
if(drawing&&event.ctrlKey){
with(oo.style){
left=(oldx>event.x+el.scrollLeft)?event.x+el.scrollLeft:oldx;
top=(oldy>event.y+el.scrollTop)?event.y+el.scrollTop:oldy;
width=Math.abs(el.scrollLeft+event.x-oldx)
height=Math.abs(el.scrollTop+event.y-oldy)
display="block";
}
}
});
}
//创建新层
function createDiv()
{
var thisid="user_"+String(parseInt(Math.random ()*1000));
var oNewdiv=document.createElement ("div");
with(oNewdiv){
id=thisid;
className="usualDiv";
style.display="none";
//add object event here
attachEvent("onfocus",focusOn);
}
document.body.appendChild(oNewdiv);
return oNewdiv;
}
//层被选中后的动作
function focusOn()
{
var aDivs=document.all.tags ("div");
var i
oo=event.srcElement;
for(i=0;i<aDivs.length;i++){
if(aDivs[i].id.substring(0,4)=="user"){
if( aDivs[i].id==oo.id) aDivs[i].className="focusOn";
else
aDivs[i].className="usualDiv";
}
}
fShowCs(oo);
}
//改变系统工作状态
function fChgStatus(obj)
{
if(drawing==false) drawing=true;
else
drawing=false;
obj.value=drawing;
}
//层对齐
function align(obj)
{
var precision=10;
if(!obj) return;
with(obj.style){
left=(parseInt(parseInt(left)/precision)*precision).toString();
top=(parseInt(parseInt(top)/precision)*precision).toString();
height=(parseInt(parseInt(height)/precision)*precision).toString();
width=(parseInt(parseInt(width)/precision)*precision).toString();
}
}
//显示改变层大小的四个按钮
function fShowCs(obj)
{
if(!obj) return;
with(document.all.sys_csleft.style){
top=(((parseInt(obj.style.height)/2))+parseInt(obj.style.top)-5).toString();
left=(parseInt(obj.style.left)-5).toString();
display="block";
}
with(document.all.sys_csright.style){
top=(((parseInt(obj.style.height)/2))+parseInt(obj.style.top)-5).toString();
left=(parseInt(obj.style.left)+parseInt(obj.style.width)-5).toString();
display="block";
}
with(document.all.sys_csup.style){
top=(parseInt(obj.style.top)-5).toString();
left=(parseInt(obj.style.left)+parseInt(parseInt(obj.style.width)/2)-5).toString();
display="block";
}
with(document.all.sys_csdown.style){
top=(parseInt(obj.style.top)+parseInt(obj.style.height)-5).toString();
left=(parseInt(obj.style.left)+parseInt(parseInt(obj.style.width)/2)-5).toString();
display="block";
}
}
//改变鼠标指针外观
function fChgCursor(obj,type)
{
if(!obj) return;
obj.style.cursor=type;
}
//改变层大小
function fChgSize(obj,direction)
{
if(!oo&&!obj) return ;
//obj.setCapture();
obj.attachEvent("onmousemove",function(){
oo.style.width=event.x;
});
}
</script>
</head>
<body onSelectstart="return false;" onDragstart="return false;" name="wholebody">
<!-- System Toolbox-->
<table id=sys_toolbox border="0" cellpadding="0" cellspacing="0" bgcolor="#990000" style="display:none;position:absolute;left:0;top:0;width:200;height:120;z-index:99">
<tr>
<td><table height="100%" width="100%" border="0" cellspacing="1" cellpadding="3">
<tr>
<td bgcolor="#FFFFFF">系统工具</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">
<input type="button" value="准备">
</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" id=sys_status></td>
</tr>
</table></td>
</tr>
</table>
<!-- Change DIV size , cs=ChangeSize -->
<img id=sys_csleft class="cs" src="images/cs.gif" onmouseover="fChgCursor(this,'e-resize')" onclick="fChgSize(this,'left')">
<img id=sys_csright class="cs" src="images/cs.gif" onmouseover="fChgCursor(this,'w-resize')" onclick="fChgSize('right')">
<img id=sys_csup class="cs" src="images/cs.gif" onmouseover="fChgCursor(this,'s-resize')" onclick="fChgSize('up')">
<img id=sys_csdown class="cs" src="images/cs.gif" onmouseover="fChgCursor(this,'n-resize')" onclick="fChgSize('down')">
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -