【问题标题】:Sticky button ionic at bottom of screen屏幕底部的粘性按钮离子
【发布时间】:2019-05-16 00:32:37
【问题描述】:

我正在使用 ionic 制作一个 Android 应用,我想知道如何制作一个在用户向下滚动时始终显示在屏幕底部的粘性按钮。

【问题讨论】:

    标签: ionic2 ionic3 sticky


    【解决方案1】:

    您可以使用 footer 组件:

    页脚是位于底部的页面的根组件 页。页脚可以是 ion-toolbar 的包装器,以确保内容 区域大小正确。

    <ion-content></ion-content>
    
    <ion-footer>
      <ion-toolbar>
        <button ion-button text-only>Your Button</button>
      </ion-toolbar>
    </ion-footer>
    

    由于ion-footer 位于ion-content外部,因此页脚将始终显示,即使页面内容很多且用户位于页面顶部.


    StackBlitz demo


    【讨论】:

    • 当用户向下滚动时,我需要组件始终位于屏幕底部。当用户向下滚动时,组件必须始终可见。页脚将仅保留在屏幕底部,如果用户位于长屏幕顶部,则页脚将不可见。
    • @Manos 不正确;页脚将始终显示在页面底部,即使用户位于页面顶部
    • 是的,它始终位于底部,但我认为如果用户位于长屏幕的顶部,它不会可见。我想我需要添加一些 CSS 让它变得 STICKY。前任。位置:固定;底部:0;
    • 我会试试看。感谢您的支持。
    • 你是对的页脚。即使用户位于屏幕顶部,它也会始终显示。再次感谢您的支持
    猜你喜欢
    • 2019-11-10
    • 2017-12-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-08
    • 2021-06-17
    • 1970-01-01
    相关资源
    最近更新 更多