求助关于默认收缩点击展开的方法 以下是写好的HTML代码,如何用javascript

JavaScript029

求助关于默认收缩点击展开的方法 以下是写好的HTML代码,如何用javascript,第1张

//很简单啊

//JS CODE 

//直接控制样式display:none;即可

$('#more').click(function(){

    $('#out').toggleClass('show')//增加show样式

})

至于你所说的缓冲,可以增加样式

/*CSS CODE*/

.back.show{

    display:block !important

    transition:all .5s ease//慢慢的展示,兼容性没有写

}

.back{

    display:none

}

至于其他的样式需要你自己添加了。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<style type="text/css">

#div1 {width: 400pxbackground: lightbluemargin: 0 auto}

</style>

</head>

<body>

<div id="div1">说真的这届美国队甜瓜和欧文才是真大腿,每到要分、硬仗的时候没怂过,欧文的特点摆在这里,正是这种特点才让他取得现在的成就,欧文在场上现在出球速度并不慢关键是其他人真的没有什么得分、串联的能力啊,就像我在其他帖子里说的,这只球队不缺得分手,缺少的是一名轴心,组织者,要是保罗、老詹、哈登来其一都可以让进攻流畅起来,总之,这个锅不应该欧文来背。

<a href="javascript:">>>收缩</a>

</div>

</body>

<script type="text/javascript">

var oDiv=document.getElementById('div1')

var oA=oDiv.getElementsByTagName('a')

var onOff=false

var old=''

old=oDiv.innerHTML

oDiv.innerHTML=oDiv.innerHTML.substring(0,20)+'......<a href="javascript:">>>展开</a>'

oA[0].onclick=function move()

{

if(onOff)

{

onOff=false

old=oDiv.innerHTML

oDiv.innerHTML=oDiv.innerHTML.substring(0,20)+'......<a href="javascript:">>>展开</a>'

oA=oDiv.getElementsByTagName('a')

oA[0].onclick=move

}

else

{

onOff=true

oDiv.innerHTML=old

oA=oDiv.getElementsByTagName('a')

oA[0].onclick=move

}

}

</script>

</html>