直播平台制作,文字过多时,自动折叠显示查看更多选项
直播平台制作,文字过多时,自动折叠显示查看更多选项
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> |
以上就是直播平台制作,文字过多时,自动折叠显示查看更多选项, 更多内容欢迎关注之后的文章
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现