如何在滚动内容时固定标题

时间:2016-06-17 15:00:07

标签: html5 css3 sapui5 sap-fiori

我正在尝试制作标题&amp;滚动主要内容时固定选项卡。自那2个标题图像&amp; html标签位于页面<content>内。它滚动。但是如何使其固定在其位置?或者是否有任何替代解决方案将标题放在页面内容之外?这是我的代码

    <mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" controllerName="budgetspend.controller.App" xmlns:html="http://www.w3.org/1999/xhtml"
displayBlock="true">
<App id="BA_APP">
    <pages>
        <Page>
            <content>
                <Image class="logo" src="../images/logo_new.png"/>
                <Image class="header" src="../images/header-bg.png"/>
                <html:ul class="tab">
                    <html:li>
                        <html:a id="onBud" class="tablinks active">Budget Analyzer</html:a>
                    </html:li>
                    <html:li>
                        <html:a id="onSpend" class="tablinks">Spend Analyzer</html:a>
                    </html:li>
                </html:ul>
                <sap.ui.layout:VerticalLayout xmlns:sap.ui.layout="sap.ui.layout" id="budget_layt" class="lay_cont">
                    <sap.ui.layout:content>  .............
  

注意:标题图像&amp;标签覆盖近130px。所以我不能把它放在<headerContent>标签内。

1 个答案:

答案 0 :(得分:0)

您可以将页面的内容部分(现在是VerticalLayout)放入sap.m.ScrollContainer,为其内容提供滚动功能。这样,您可以滚动容器内的内容。您可以为滚动容器设置自定义高度。

您是否尝试过实施sap.m.IconTabBar控件而不是在XML视图中创建HTML元素?