代码之家  ›  专栏  ›  技术社区  ›  Ole

动态移动固定位置的按钮?

css-transforms css-transitions angular css html
  •  -1
  • Ole  · 技术社区  · 3 年前

    试图弄清楚为什么这是有效的语义。

    在这个管理面板中,有一个固定在UI右侧的设置按钮。

    https://www.akveo.com/ngx-admin/pages/layout/stepper

    如果我们单击设置按钮,设置面板将展开,从而移动按钮。

    然而,如果我们看看 right css位置(使用开发工具)仍然设置为 0 在移动按钮之后。

    只是好奇这是怎么回事?我的理解是 fixed 定位是相对于视口工作的,所以我希望按钮保持原位,面板覆盖它。。。

    1 回复  |  直到 3 年前
        1
  •  1
  •   Mr. Stash    3 年前

    单击该按钮时,一个名为“expanded”的类将添加到“ngx toggle settings button元素”中

    这个“扩展”类包含规则“transform:translateX(-16rem);”它在负x轴上移动16rem单元内的元件和按钮

    推荐文章
    code-geek  ·  Jquery根据单选按钮选择隐藏或显示文本字段
    1 年前
    Jamie  ·  在CSS链接的文件名中添加Jinja占位符
    1 年前
    ptownbro  ·  重叠分区标签,同时保持以下所有分区和内容就位
    1 年前
    Luke Frost IEng MIMechE  ·  Bootstrap 5.3在Div中的项目位置没有如我所期望的那样显示
    1 年前
    Reegan  ·  使用Angular ngFor指令在html中渲染嵌套对象值
    1 年前
    wqyutv  ·  当找不到文件时,任何破坏错误的东西都不会出现,我该怎么解决这个问题?
    1 年前
    user29519291  ·  为不同的变量创建一个带有可重用Click函数的简单菜单
    1 年前
    Gukkey  ·  在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?
    1 年前
    Lorenzo Bertolaccini  ·  在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组
    1 年前
    john Rizzo  ·  按钮背景颜色、悬停和活动状态存在问题
    1 年前
    关于   移动版
    代码之家 - 一站式码农服务社区
    沪ICP备11025650号