js实现更多和收起的效果

HTML部分

              <a href="javascript:;" class="hide-value"  >                                                                                                  <i id="more-text" >更多</i>                                                                                                             <i id="upupup" style="display: none;"  >收起</i>                                                       </a>                                        


js部分


document.getElementById('more-text').addEventListener('click', function fn() {

  document.getElementById("pinpai").style.height = "140px";

  document.getElementById("more-text").style.display = "none";

  document.getElementById("upupup").style.display = "block";

})

document.getElementById('upupup').addEventListener('click', function fn() {

  document.getElementById("pinpai").style.height = "70px";

  document.getElementById("more-text").style.display = "block";

  document.getElementById("upupup").style.display = "none";

})

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容