怎样把在js里面将元素缓慢显示

JavaScript08

怎样把在js里面将元素缓慢显示,第1张

你好,你可以  引用  js   里 jQuery 库.

引用了 百度的 jquery.min.js 。如下

<!DOCTYPE html>

<html>

<head>

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">

</script>

<script>

$(document).ready(function(){

  $("button").click(function(){

 

    $("#div3").fadeIn(6000)

  })

})

</script>

</head>

<body>

<button>Click to fade in boxes</button>

<br><br>

<div id="div3" style="width:80pxheight:80pxdisplay:nonebackground-color:blue"></div>

</body>

</html>       

鼠标移到DIV1上时,DIV2显示,然后鼠标移到DIV2,再移开,2秒后DIV2隐藏:

<script type="text/javascript">

function showDiv2(){

document.getElementById("div2").style.display="block"

}

function hiddenDiv2(){

setTimeout("document.getElementById(\"div2\").style.display=\"none\"",2000)

}

</script>

<div id="div1" onmouseover="showDiv2()" onmouseout=" ">div1</div>

<div id="div2" onmouseout="hiddenDiv2()" >div2</div>

// 隐藏函数

function hideDiv(){

// 隐藏代码

...

// 2秒后显示代码

setTimeout(showDiv,2000)

}

// 显示函数

function showDiv(){

// 显示代码

}