Heim > Backend-Entwicklung > PHP-Tutorial > 显示隐藏网页部分内容展开收起页面特效

显示隐藏网页部分内容展开收起页面特效

WBOY
Freigeben: 2016-07-25 09:02:35
Original
2911 Leute haben es durchsucht
  1. 网页资源代码站提示:测试显示隐藏网页部分内容展开收起页面特效这个代码看效果--因加载JS有必要刷新
  2. 显示隐藏网页部分内容网页特效-dyunr.com
  3. <script><li>function $(element){<li>return element = document.getElementById(element);<li>}<li>function $D(){<li>var d=$('class1content');<li>var h=d.offsetHeight;<li>var maxh=300;<li>function dmove(){<li>h+=50; //设置层展开的速度23sc.cn<li>if(h>=maxh){<li>d.style.height='300px';<li>clearInterval(iIntervalId);<li>}else{<li>d.style.display='block';<li>d.style.height=h+'px';<li>}<li>}<li>iIntervalId=setInterval(dmove,2);<li>}<li>function $D2(){<li>var d=$('class1content');<li>var h=d.offsetHeight;<li>var maxh=300;<li>function dmove(){<li>h-=50;//设置层收缩的速度23sc.cn<li>if(h<=0){<li>d.style.display='none';<li>clearInterval(iIntervalId);<li>}else{<li>d.style.height=h+'px';<li>}<li>}<li>iIntervalId=setInterval(dmove,2);<li>}<li>function $use(){<li>var d=$('class1content');<li>var sb=$('stateBut');<li>if(d.style.display=='none'){<li>$D();<li>sb.innerHTML='展开';<li>}else{<li>$D2();<li>sb.innerHTML='收缩';<li>}<li>}<li></script>
  4. Alone展开隐藏效果

  5. 展开
  6. 显示隐藏网页部分内容展开收起页面特效 ==小蜗牛问妈妈:为什么我们从生下来,就要背负这个又硬又重的壳呢?

  7. 妈妈:因为我们的身体没有骨23sc.cn骼的支撑,只能爬,又爬不快。所以要这个壳的保护!
  8. 小蜗牛:毛虫姊姊没有骨头,也爬不快,为什么她却不用背这个又硬又重的壳呢?
  9. 妈妈:因为毛虫姊姊能变成蝴蝶,23sc.cn天空会保护她啊。
  10. 小蜗牛:可是蚯蚓弟弟也没骨头爬不快,也不会变成蝴蝶他什么不背这个又硬又重的壳呢?
  11. 妈妈:因为蚯蚓弟弟会钻土, 大地会保护他啊。
  12. 小蜗牛哭了起来:23sc.cn我们好可怜,天空不保护,大地也不保护。
  13. 蜗牛妈妈安慰他:所以我们有壳啊!我们不靠天,也不靠地,我们靠自己。
  • 有效果吗?谢谢您支持我们的网页资源站,我们的网址是http://www.dyunr.com
  • 本文来自: 网页资源网(www.dyunr.com) 转载复制请保留原出处,谢谢!详细出处参考:http://www.dyunr.com/Code/dm8/164.html
  • 复制代码 显示隐藏网页部分内容展开收起页面特效


    Quelle:php.cn
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage