V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
PeakFish
V2EX  ›  前端开发

前端进,请大家测试个页面。行内按钮控制文本显示隐藏

  •  1
     
  •   PeakFish · 2021-04-06 16:16:13 +08:00 · 1285 次点击
    这是一个创建于 1333 天前的主题,其中的信息可能已经有所发展或是发生改变。

    描述一下需求:文字太多超过 n 行的时候,只显示 n 行,展开按钮 和 收起按钮 和文本同一行显示。

    这种需求,没找到前端实现有什么很好的方法。

    本例是 二分查找 & 修改文本长度,然后 getClientRects 计算行数。

    大家还有什么思路可以交流交流。

    大家给测试看看 地址: https://peakfish.github.io/inline-button-text-show-hide/more.html

    4 条回复    2021-04-06 19:59:21 +08:00
    PinkRabbit
        1
    PinkRabbit  
       2021-04-06 16:38:02 +08:00
    -webkit-line-clamp ?
    xiayue
        2
    xiayue  
       2021-04-06 19:19:27 +08:00 via Android
    两个 dom ,分别显示
    qiayue
        4
    qiayue  
       2021-04-06 19:59:21 +08:00
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2627 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 15:41 · PVG 23:41 · LAX 07:41 · JFK 10:41
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.