请教前端大佬们如下排版如何是其中一块最大化

查看 90|回复 6
作者:imherer   


  • 假如有一个如上图的页面,分 ABC 三块,或者说就 BC 两块,如何实现 BC 两块各自最大化

  • 就是类似于 BC 右上角各有一个最大化还原按钮,点击最大化之后整个页面就只显示 B 或者 C ,点击还原就回到如上图

  • 想请教下各位前端大佬这类的方案该如何实现呢

  • wu67   
    不要想着最大化. 想想隐藏其他元素.
    只要让 bc 区块和容器宽高能够自适应就行, 然后点 c 把左侧隐藏, 点 b 把 ac 隐藏, 内容会自动撑开的.
    corcre   
    点击最大化的时候把另外两块 display:none, 还原的时候再显示出来🐶
    anjianshi   



    b-wrapper 和 c-wrapper 始终是非最大化的尺寸和位置。
    b 和 c 非最大化时,留在 wrapper 内撑满 wrapper ,
    b 要最大化时,把它改成 position: absolute ,然后撑满整个页面,盖住其他内容,
    要从最大化还原回来时,取消 position: absolute 然后重新变回撑满 wrapper
    ljkWeb   
    flex 布局,bc 自适应,按钮修改 a 的 dispaly,最大化是为 none,还原与正常时为 block
    sy0uta1k0n   
    点击的时候加上一个 class 然后给这个 class 加个 @keyframe
    anjianshi   
    我猜 你要找的是他:
    https://www.framer.com/motion/
    往下翻翻 有个点击放大动画
    您需要登录后才可以回帖 登录 | 立即注册

    返回顶部