偶自己做的~请指点 - JavaScript论坛

linuxpluto

等　级：贵宾
威　望：13
帖　子：889
专家分：23
注　册：2005-8-14

楼主

问题点数：0 回复次数：45

偶自己做的~请指点

[CODE]

<style>
.outerbox {
display:block;
overflow:vibile;
position:absolute;
}

.innerbox {
border:1px solid black;
display:block;
overflow:hidden;
}

.rightbox {
overflow:vibile;
position:absolute;
border:1px solid black;
height:800;
}

.rightbody {
display:block;
height:520;
overflow:visible
}

.itemhead {
border:1px solid gray;
text-align:right;
width:100%;
background-color:#0a246a;
filter:progid:DXImageTransform.Microsoft.Alpha(startX=0,startY=7, finishX=100, finishY=7,style=1,opacity=100,finishOpacity=0);

}

.itembody{
position:relative;
display:block;
overflow:hidden;
}

.itemrightbody{
position:relative;
display:none;
overflow:hidden;
height:300;
border:1px solid black;
}

.app {
cursor:hand;
position:relative;
}
p {
line-height:140%;
text-indent:24px;
}
body {
font-size:12px;
}
td {
font-size:12px;
}

ul {
margin:5px;
text-indent:15px;
}
li {
font-family:"Times New Roman", Times, serif
text-decoration:underline;
color:#0000cd;
}
br {
line-height:2px;
}
.msk {
display:none;
background-color:white;
position:absolute;
left:0;
top:0;
width:1000;
height:768;
z-index:20;
filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=50,finishOpacity=100);
}
.dspbox {
display:none;
border:1px solid black;
width:600;
height:500;
position:absolute;
left:200;
top:50;
background-color:white;
z-index:25;
word-wrap:break-word;
}

.dspbody {
display:block;
overflow:hidden;
border:0px solid gray;
}
.header {
position:absolute;
left:100;
top:10;
width:800;
height:50;
border:1px solid black;
}
.minbox {
border:1px solid gray;
position:absolute;
width:150;
display:none;
text-align:right
}
.titl {
font-family:"Courier New", Courier, mono;
font-size:19px;
background-color:#e9967a;
width:100%;
filter:progid:DXImageTransform.Microsoft.Alpha(startX=0,startY=0, finishX=100, finishY=100,style=1,opacity=100,finishOpacity=0);
}

.main {
display:block;
overflow:hidden;
border:1px solid gray;
}
.main1 {
display:block;
overflow:hidden;
border:1px solid red;
}

.eff {
height:25;
border:1px solid gray;
}

</style>
<script defer>
var sss,sssM,sssD,sssMin;
function init() {
left.style.pixelLeft=header.offsetLeft;
left.style.pixelTop=header.offsetHeight+20;
left.style.pixelWidth=195;
right.style.pixelLeft=left.offsetLeft+left.offsetWidth+10;
right.style.pixelTop=left.offsetTop;
right.style.pixelWidth=header.offsetWidth-left.offsetWidth-10;

timeH.value=timeB.offsetHeight;
libH.value=libB.offsetHeight;
codeH.value=codeB.offsetHeight;
scriptgameH.value=scriptgameB.offsetHeight;
effH.value=effB.offsetHeight;
minD.style.pixelLeft=10;
}

function scro() {//最小化div的显示和停止
if (minD.style.display=="block") {
minD.style.pixelTop=document.body.scrollTop+document.body.clientHeight-20;
//alert(document.all('minD').style.pixelTop+" "+document.all('minD').style.pixelLeft+" "+document.all('minD').style.pixelHeight)
sssMin=setTimeout("scro()","5")
}
if (minD.style.display=="none") {
//cleatTimeout(sssMin)
}
}

function scroM() {//遮罩层内容的显示和停止
if (mask.style.display=="block") {
mask.style.pixelTop=document.body.scrollTop;
sssM=setTimeout("scroM()","5")
}
if (mask.style.display=="none") {
//cleatTimeout(sssM)
}
}

function scroD() {//的显示和停止
if (dsp.style.display=="block") {
dsp.style.pixelTop=document.body.scrollTop+50;
sssD=setTimeout("scroD()","5")
}
if (dsp.style.display=="none") {
//cleatTimeout(sssD)
}
}

function roll(obj) {
dd=document.all(obj)
dc=document.all(obj+'B')
if (dd.value=="max") {
dc.style.pixelHeight=dc.offsetHeight-4;
sss=setTimeout("roll('"+obj+"')","1")
if (dc.offsetHeight<=5)
{ clearTimeout(sss)
dd.value="min"
dc.style.display='none'
}
}
}

function rollright(obj) {
dd=document.all(obj)
dc=document.all(obj+'B')
dc.style.display='none'
}

function maxOright(obj) {
dd=document.all(obj);
dc=document.all(obj+'B')
if (dc.value=='max')
{
dc.style.display='none';dc.value='min'
}
else
{
dc.style.display='block';dc.value='max'
}
}

function closeObj(obj) {
dd=document.all(obj)
dd.style.display='none'
}

function displayObj() {
mask.style.display='block';
dsp.style.display='block';
minD.style.display='none'
}

function minObj() {
dsp.style.display="none"
mask.style.display="none"
minD.style.display='block'
}

function closeall() {
dsp.style.display="none"
mask.style.display="none"
minD.style.display="none"
}

function leftDblclick (aa) {
dd=document.all(aa)
if (dd.value=='max')
roll(aa)
else
maxO(aa)
}
</script>

<div id=left class=outerbox>
<div id=time class=innerbox value="max" onDblclick="leftDblclick('time')">
<div id=timeH class=itemhead value=""><span class=app onclick="roll('time')">（可以在该窗口任何地方双击，下同）＿</span><span class=app onclick="maxO('time')">□</span></div>
<div id=timeB class=itembody><script language="javascript" src="time.js"></script></div>
</div><br>
<div id=lib class=innerbox value="max" onDblclick="leftDblclick('lib')">
<div id=libH class=itemhead value=""><span class=app onclick="roll('lib')">＿</span><span class=app onclick="maxO('lib')">□</span></div>
<div id=libB class=itembody>
<table border=0 cellpadding=0 cellspacing=0>
<tr><td>
<ul style="margin:5px;text-indent:15px">
<li>Window对象
<li>Document对象
<li>Event对象
<li>Number对象
</ul></td>
<td>
<ul style="margin:5px;text-indent:15px">
<li>String对象
<li>Regexp对象
<li>Date对象
<li>Math对象
</ul></td></tr>
<tr><td colspan=2 align=right>More...</td></tr></table>
</div>
</div><br>
<div id=code class=innerbox value="max" onDblClick="leftDblclick('code')">
<div id=codeH class=itemhead value=""><span class=app onclick="roll('code')">＿</span><span class=app onclick="maxO('code')">□</span></div>
<div id=codeB class=itembody>
<table border=0 cellpadding=0 cellspacing=0>
<tr><td>
<ul style="margin:5px;text-indent:15px">
<li>关键属性
<li>关键属性
<li>关键属性
<li>关键属性
</ul></td>
<td>
<ul style="margin:5px;text-indent:15px">
<li>关键方法
<li>关键方法
<li>关键方法
<li>关键方法
</ul></td></tr>
<tr><td colspan=2 align=right>More...</td></tr></table>
</div>
</div><br>
<div id=scriptgame class=innerbox value="max" onDblclick="leftDblclick('scriptgame')">
<div id=scriptgameH class=itemhead value=""><span class=app onclick="roll('scriptgame')">＿</span><span class=app onclick="maxO('scriptgame')">□</span></div>
<div id=scriptgameB class=itembody>
<table border=0 cellpadding=0 cellspacing=0>
<tr><td>
<ul style="margin:5px;text-indent:15px">
<li>潜艇大战
<li>五子棋
<li>推箱子
<li>扫雷
</ul></td>
<td>
<ul style="margin:5px;text-indent:15px">
<li>连连看
<li>俄罗斯方块
<li>空
<li>空
</ul></td></tr>
<tr><td colspan=2 align=right>More...</td></tr></table>
</div>
</div><br>
<div id=eff class=innerbox value="max" onDblclick="leftDblclick('eff')">
<div id=effH class=itemhead value=""><span class=app onclick="roll('eff')">＿</span><span class=app onclick="maxO('eff')">□</span></div>
<div id=effB class=itembody>
<table border=0 cellpadding=0 cellspacing=0>
<tr><td>
<ul style="margin:5px;text-indent:15px">
<li>按钮
<li>状态栏
<li>loading
<li>鼠标
</ul></td>
<td>
<ul style="margin:5px;text-indent:15px">
<li>菜单
<li>滚动条
<li>窗口
<li>日期
</ul></td></tr>
<tr><td colspan=2 align=right>More...</td></tr></table>
</div>
</div>
</div>

<div id=right class=rightbox value="max">
<div id=rightH class=itemhead value=""> </div>
<div id=rightB class=rightbody>
<div id=rtbtn class=itembody>
<div id=rtbtnH class=titl onclick="maxOright('rtbtn')">按钮效果(可以单击下同)</div>
<div id=rtbtnB value="min" class=itemrightbody><div onclick="displayObj()">点我</div></div>
</div><br>

<div id=rtMenu class=itembody>
<div id=rtMenuH class=titl onclick="maxOright('rtMenu')">菜单效果</div>
<div id=rtMenuB value="min" class=itemrightbody onmouseout="rollright('rtMenu')"></div>
</div><br>

<div id=rtstatu class=itembody>
<div id=rtstatuH class=titl onclick="maxOright('rtstatu')">状态栏效果</div>
<div id=rtstatuB value="min" class=itemrightbody onmouseout="rollright('rtstatu')"></div>
</div><br>

<div id=rtscro class=itembody>
<div id=rtscroH class=titl onclick="maxOright('rtscro')">滚动条效果</div>
<div id=rtscroB value="min" class=itemrightbody onmouseout="rollright('rtscro')"></div>
</div><br>

<div id=rtload class=itembody>
<div id=rtloadH class=titl onclick="maxOright('rtload')">Loading效果</div>
<div id=rtloadB value="min" class=itemrightbody onmouseout="rollright('rtload')"></div>
</div><br>

<div id=rtwindow class=itembody>
<div id=rtwindowH class=titl onclick="maxOright('rtwindow')">窗口效果</div>
<div id=rtwindowB value="min" class=itemrightbody onmouseout="rollright('rtwindow')"></div>
</div><br>

<div id=rtmouse class=itembody>
<div id=rtmouseH class=titl onclick="maxOright('rtmouse')">鼠标效果</div>
<div id=rtmouseB value="min" class=itemrightbody onmouseout="rollright('rtmouse')"></div>
</div><br>

<div id=rtdate class=itembody>
<div id=rtdateH class=titl onclick="maxOright('rtdate')">日期效果</div>
<div id=rtdateB value="min" class=itemrightbody onmouseout="rollright('rtdate')"></div>
</div>

</div>
</div>

<div id=libtemp style="display:none">
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li><div onclick="displayObj()">点我</div>
<li>Screen
<li>Location
</ul>
</div>
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li>Frame
<li>Screen
<li>Location
</ul>
</div>
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li>Frame
<li>Screen
<li>Location
</ul>
</div>
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li>Frame
<li>Screen
<li>Location
</ul>
</div>
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li>Frame
<li>Screen
<li>Location
</ul>
</div>
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li>Frame
<li>Screen
<li>Location
</ul>
</div>
<div class=main><div class=titl>Window对象</div>
<ul style="margin:5px;text-indent:15px">
<li>Frame
<li>Screen
<li>Location
</ul>
</div>
</div>
[/CODE]