展开收起效果的实现

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

开发工具与关键技术:DW  

作者:黄海浪

撰写时间:2019年2月20日

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

展开收起效果的实现需要用到CSS3动画和JS代码,主要效果是点击展开按钮就会向下展开显示隐藏部分,点击收起就会慢慢向上收起隐藏部分内容

展开收起效果的实现

这是CSS3动画效果样式部分代码,再看一下JS代码

展开收起效果的实现

引入ID之后就设置展开和收起按钮的点击事件就行,一开始给它一个高度是80px收起按钮隐藏起来展开按钮显示,点击展开高度就变成250px,展开隐藏,收起显示出来,就这么简单

相关文章:

  • 2021-12-18
  • 2021-12-19
  • 2021-06-06
  • 2022-12-23
  • 2021-08-05
  • 2022-12-23
  • 2021-07-21
猜你喜欢
  • 2021-08-28
  • 2021-07-01
  • 2021-12-04
  • 2021-10-11
  • 2021-06-22
  • 2022-12-23
  • 2021-12-12
相关资源
相似解决方案