直播平台制作,文字过多时,自动折叠显示查看更多选项

直播平台制作,文字过多时,自动折叠显示查看更多选项

1
<!DOCTYPE html><br><html><br><head><br><meta charset="UTF-8"><br><meta name="viewport" content="width=device-width, initial-scale=1.0"><br><meta http-equiv="X-UA-Compatible" content="ie=edge"><br><title></title><br><script type="text/javascript" src="echart/js/jquery-1.11.2.js"></script><br><style type="text/css"><br>.aa{<br>height: 40px;<br>overflow: hidden;<br>position: relative;<br>}<br>.aa span{<br>display: none;<br>position: absolute;<br>right: 0;<br>bottom: 0;<br>z-index: 2;<br>color: blueviolet;<br><br>cursor: pointer;<br>}<br>.aa.zk::after{<br>display: block;<br>position: absolute;<br>right: 0;<br>bottom: 0;<br>content: '...展开';<br>color: red;<br>background-color: #FFFFFF;<br>}<br>.aa.sq::before{<br>display: block;<br>position: absolute;<br>right: 0;<br>bottom: 0;<br>content: '收起';<br>color: red;<br>background-color: #FFFFFF;<br>}<br>img{<br>display: block;<br>height: 500px;<br>}<br></style><br></head><br><body><br><ul><br><li>就是看见了是非得失的就是看见了是非得失的就<br><input type="hidden" name="" id="" value="A" /><br><span>...展开</span><br></li><br><li><br>就是看见了是非得失的就是看见了是非得失的就是看见了是非得失的就<br><img src="images/288CE32AB5B012F9D49D46C5664AE3E4.jpg" ><br><input type="hidden" name="" id="" value="A" /><br><span>...展开</span><br></li><br><li>就是看见了是非得失的就是看见了是非得失的就是看见了是非得失的就<br>就是看见了是非得失的就是看见了是非得失的就是看见了是非得失的<br>就是看见了是非得失的就是看见了是非得失的就是看见了是非得失的<br>就是看见了是非得失的就是看见了是非得失的就是看见了是非得失的<br>是看见了是非得失的就是看见了是非得失的就是看见了是非得失的<br><input type="hidden" name="" id="" value="A" /><br><span>展开</span><br></li><br></ul><br><script type="text/javascript"><br>var list = $(".aa");<br>for(var i =0;i<list.length;i++){<br>if(list[i].scrollHeight > 40){<br>console.log(list[i].lastElementChild);<br>list[i].lastElementChild.style.display="block";<br>}<br>}<br>$(document).on('click',".sprake",function(){<br>var hideval = $(this).siblings("input[type='hidden']").val();<br>if(hideval == 'A'){<br>$(this).parent().css({"overflow":"auto","height":"auto"});<br>$(this).siblings("input[type='hidden']").val("B");<br>$(this).html("收起");<br>}else{<br>$(this).parent().css({"overflow":"hidden","height":"40px"});<br>$(this).siblings("input[type='hidden']").val("A");<br>$(this).html("展开");<br>}<br>})<br></script><br></body><br></html>

​以上就是直播平台制作,文字过多时,自动折叠显示查看更多选项, 更多内容欢迎关注之后的文章

 

posted @   云豹科技-苏凌霄  阅读(51)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现
点击右上角即可分享
微信分享提示