快捷導(dǎo)航

js實(shí)現(xiàn)從中間開(kāi)始往上下展開(kāi)網(wǎng)頁(yè)窗口的方法

更新時(shí)間：2015年03月02日 10:58:33 作者：站長(zhǎng)學(xué)院

這篇文章主要介紹了js實(shí)現(xiàn)從中間開(kāi)始往上下展開(kāi)網(wǎng)頁(yè)窗口的方法,是非常實(shí)用的js窗口效果,需要的朋友可以參考下

本文實(shí)例講述了js實(shí)現(xiàn)從中間開(kāi)始往上下展開(kāi)網(wǎng)頁(yè)窗口的方法。分享給大家供大家參考。具體分析如下：

這個(gè)是從中間然后慢慢向上下展開(kāi)的頁(yè)面顯示效果，也還不錯(cuò)，代碼如下：

<html>

<head>

<title>js從中間展開(kāi)的網(wǎng)頁(yè)窗口顯示</title>

<style>

<!--

.intro{

position:absolute;

left:0;

top:0;

layer-background-color:yellow;

background-color:#336699;

border:0.1px solid #336699

}

-->

</style>

</head>

<body>

<div id="i1" class="intro"></div><div id="i2" class="intro"></div>

<script language="JavaScript1.2">

var speed=20

var temp=new Array()

var temp2=new Array()

if (document.layers){

for (i=1;i<=2;i++){

temp[i]=eval("document.i"+i+".clip")

temp2[i]=eval("document.i"+i)

temp[i].width=window.innerWidth

temp[i].height=window.innerHeight/2

temp2[i].top=(i-1)*temp[i].height

}

}

else if (document.all){

var clipbottom=document.body.offsetHeight/2,cliptop=0

for (i=1;i<=2;i++){

temp[i]=eval("document.all.i"+i+".style")

temp[i].width=document.body.clientWidth

temp[i].height=document.body.offsetHeight/2

temp[i].top=(i-1)*parseInt(temp[i].height)

}

}

function openit(){

window.scrollTo(0,0)

if (document.layers){

temp[1].bottom-=speed

temp[2].top+=speed

if (temp[1].bottom<=0)

clearInterval(stopit)

}

else if (document.all){

clipbottom-=speed

temp[1].clip="rect(0 auto+"+clipbottom+" 0)"

cliptop+=speed

temp[2].clip="rect("+cliptop+" auto auto)"

if (clipbottom<=0)

clearInterval(stopit)

}

}

function gogo(){

stopit=setInterval("openit()",100)

}

gogo()

</script>

</body>

</html>

希望本文所述對(duì)大家的Go語(yǔ)言程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JS面試題---關(guān)于算法臺(tái)階的問(wèn)題
下面小編就為大家?guī)?lái)一篇JS面試題---關(guān)于算法臺(tái)階的問(wèn)題。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-07-07
小程序server請(qǐng)求微信服務(wù)器超時(shí)的解決方法
這篇文章主要介紹了小程序server請(qǐng)求微信服務(wù)器超時(shí)的解決方法，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2019-05-05
JS數(shù)組扁平化、去重、排序操作實(shí)例詳解
這篇文章主要介紹了JS數(shù)組扁平化、去重、排序操作,結(jié)合實(shí)例形式詳細(xì)分析了JS數(shù)組扁平化、去重、排序等相關(guān)操作原理、實(shí)現(xiàn)技巧與注意事項(xiàng),需要的朋友可以參考下
2020-02-02
Javascript自定義函數(shù)判斷網(wǎng)站訪問(wèn)類(lèi)型是PC還是移動(dòng)終端
如果，能夠判斷出訪問(wèn)Web網(wǎng)頁(yè)的類(lèi)型(PC還是移動(dòng)終端)。就可以解決許多絢麗多彩的 Flash效果出不來(lái)的問(wèn)題
2014-01-01
JS 實(shí)現(xiàn)復(fù)制到剪貼板的幾種方式小結(jié)
本文主要介紹了JS 實(shí)現(xiàn)復(fù)制到剪貼板的幾種方式小結(jié),包括ClipboardAPI和document.execCommand這兩種方法,具有一定的參考價(jià)值,感興趣的可以了解一下
2025-02-02
javascript實(shí)現(xiàn)當(dāng)前頁(yè)導(dǎo)航激活的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)當(dāng)前頁(yè)導(dǎo)航激活的方法,涉及javascript操作css的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-02-02
JS中去掉if...else的多種方法
在JavaScript編程中,過(guò)多的if...elseif...else語(yǔ)句可能導(dǎo)致代碼難以維護(hù),可以通過(guò)switch語(yǔ)句、對(duì)象字面量、函數(shù)映射、數(shù)組或映射對(duì)象分發(fā)、提前返回以及使用數(shù)組的find方法來(lái)優(yōu)化這種復(fù)雜的條件判斷,提高代碼的可讀性和維護(hù)性,下面就來(lái)介紹一下
2024-09-09
js實(shí)現(xiàn)隨機(jī)點(diǎn)名系統(tǒng)(實(shí)例講解)
下面小編就為大家?guī)?lái)一篇js實(shí)現(xiàn)隨機(jī)點(diǎn)名系統(tǒng)(實(shí)例講解)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-10-10
解決bootstrap中modal遇到Esc鍵無(wú)法關(guān)閉頁(yè)面
Bootstrap，來(lái)自 Twitter，是目前最受歡迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它簡(jiǎn)潔靈活，使得 Web 開(kāi)發(fā)更加快捷。不過(guò)在使用的過(guò)程中，我們還是會(huì)遇到各種小問(wèn)題，今天我們探討的就是個(gè)人在使用中遇到的一個(gè)小BUG的修復(fù)。
2015-03-03
不提示直接關(guān)閉網(wǎng)頁(yè)窗口的JS示例代碼
本篇文章主要是對(duì)不提示直接關(guān)閉網(wǎng)頁(yè)窗口的JS示例代碼進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2013-12-12