标签不会固定在离子内部的离子含量

Question

我一直在尝试在离子含量内固定离子片，但这似乎不太可能。那么是否有任何方法可以将标签固定在离子中的可分解内容中？

        $( "ion-content" ).scroll(function() {

            var scrollWidth =  $(".main-content").height()-$(".header-bar").height();

            if (parseInt($(this).scrollTop()) > scrollWidth ) {
                $("#fixedAboutTabs").addClass("fixed");

                });


            }
            else {
                $("#fixedAboutTabs").removeClass("fixed");
                });

.fixed{
    left: 0;
    top:44px;
    position: fixed;
    z-index:100;
    width: 100%;
}

<ion-view>
 
    <div class="header-bar">
        <button class="button button-clear arrow-btn" ng-click="goBack()"> <img src="img/arrow.png" class="arrow-img"> </button>
        <h1 class="title">{{product.productName}}</h1>
    </div>


    <ion-content on-scroll="onScroll()" overflow-scroll="true" has-bouncing="false">
        <div class="main-content">

            <img src="img/video.png" class="video-img">

            <div class="product-info">
                //some content here
            </div> <!--product info closes -->

           
        </div> <!--main content closes-->

        <div id="staticAboutTabs" class="demo-tabs">
            <ul>
               //customized tabs (want to make this tabs fixed bewlow header-bar)
            </ul>
        </div>


  
    </ion-content>
</ion-view>

我使用自己的自定义标签代替离子标签。如果离子片或任何定制的标签可以固定在可滚动的离子内容

内，请告诉我

Answer 1

通过将要修复的内容放入<div slot="fixed"> </div>

来尝试此操作

<ion-content>
<div slot="fixed">
    <ion-tabs #tabs tabsPlacement="top">
        <ion-tab-bar slot="top" tabsHighlight="true">
          <ion-tab-button tab="tab1">
            <ion-label>Tab1</ion-label>
          </ion-tab-button>
          <ion-tab-button tab="tab2">
            <ion-label>Tab2</ion-label>
          </ion-tab-button>
        </ion-tab-bar>
      </ion-tabs>
      </div>
</ion-content>