可显示隐藏的层-JS特效-爱易网页

可显示隐藏的层

日期：2014-05-18　浏览次数：20643 次

欢迎光临爱易网网页脚本特效中心，点击运行按钮演示特效：

以下是程序代码

脚本说明:
把如下代码加入<head>区域中
<style>

</style>

var dragapproved=false
var zcor,xcor,ycor
function movescontentmain(){
if (event.button==1&&dragapproved){
zcor.style.pixelLeft=tempvar1+event.clientX-xcor
zcor.style.pixelTop=tempvar2+event.clientY-ycor
leftpos=document.all.scontentmain.style.pixelLeft-document.body.scrollLeft
toppos=document.all.scontentmain.style.pixelTop-document.body.scrollTop
return false
}
}
function dragscontentmain(){
if (!document.all)
return
if (event.srcElement.id=="scontentbar"){
dragapproved=true
zcor=scontentmain
tempvar1=zcor.style.pixelLeft
tempvar2=zcor.style.pixelTop
xcor=event.clientX
ycor=event.clientY
document.onmousemove=movescontentmain
}
}
document.onmousedown=dragscontentmain
document.onmouseup=new Function("dragapproved=false")
//-->
</script>
<div id="scontentmain">
<div id="scontentbar" onClick="onoffdisplay()"  align="right">
<span size=1>显示/隐藏</span>
</div>
<div id="scontentsub">
<font face="Arial"><small><small>While we didn't invent JavaScript, we sure as hell
created the best site on IT. <a href="http://www.1stscript.com">First Script</a> is
considered by many online as the definitive JavaScript technology site on the
internet. Online since December, 1997, <a href="http://www.1stscript.com">First Script</a> features over 300+ original scripts, 100+
tutorials on JavaScript programming and web design, and a highly active programming forum
where developers from all over meet and share ideas on their latest projects. Click <b><a href="http://www.1stscript.com">HERE</a></b>
for JavaScript!</small></small></font>

</div>
</div>
</div>
<script language="JavaScript1.2">

var w=document.body.clientWidth-195
var h=50

////Do not edit pass this line///////////
w+=document.body.scrollLeft
h+=document.body.scrollTop

var leftpos=w
var toppos=h
scontentmain.style.left=w
scontentmain.style.top=h

function onoffdisplay(){
if (scontentsub.style.display=='') 
scontentsub.style.display='none'
else
scontentsub.style.display=''
}

function staticize(){
w2=document.body.scrollLeft+leftpos
h2=document.body.scrollTop+toppos
scontentmain.style.left=w2
scontentmain.style.top=h2
}
window.onscroll=staticize

</script>

<a href="http://www.aiyiweb.com/js/">欢迎访问爱易网JS特效</a>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

可显示隐藏的层

相关资料更多>

推荐阅读更多>