Question

在不使用Position：sticky的情况下使水平滚动的粘滞性

ul.outer-ul {
    display: flex;
    min-width: 100%;
    padding-bottom: 32px;
    height: 200px;
    overflow-x: auto;
    position: relative;
    border-radius: 0px 0px 5px 0px;
    background-color: rgba(156, 164, 182, 0);
}

li.inner-li {
    display: flex;
    position: relative;
}

span.inner-header {
  transform: rotate(-90deg) translateX(-200px);
  transform-origin: left top 0;
  text-align: center;
  text-transform: uppercase;
  color: black;
  font-size:30px;
}
.inner-div {
    background-color: #fdfdfd;
    width: 200px;
    margin-left: 8px;
    color: rgba(45, 41, 38, 1);
    display: flex;
    border: 1px solid;
}

<ul class="outer-ul">

    <li class="inner-li">
        <span class="inner-header">A</span>
        <div class="inner-div">A1</div>
        <div class="inner-div">A2</div>
        <div class="inner-div">A3</div>

    </li>
    <li class="inner-li">
            <span class="inner-header">B</span>
            <div class="inner-div">B1</div>
            <div class="inner-div">B2</div>
    </li>
    <li class="inner-li">
            <span class="inner-header">C</span>
            <div class="inner-div">C1</div>
            <div class="inner-div">C2</div>
            <div class="inner-div">C3</div>
            <div class="inner-div">C4</div>
    </li>
    <li class="inner-li">
            <span class="inner-header">D</span>
            <div class="inner-div">D1</div>
            <div class="inner-div">D2</div>
            <div class="inner-div">D3</div>
    </li>
    <li class="inner-li">
            <span class="inner-header">E</span>
            <div class="inner-div">E1</div>
            <div class="inner-div">E2</div>
    </li>
</ul>

我使用位置粘贴来做到这一点，但是它在IE中不起作用。有什么办法可以做到这一点。就像当我滚动标题时应该像sticky.until一样，直到下一个li到来之前它的li还没有结束，应该显示其跨度。 Jquery或CSS中有什么方法可以做到这一点？ https://jsfiddle.net/xrymt3a9/3

我希望我的代码像下面的示例一样工作：https://codepen.io/geddski/pen/rjYpVr。但是IE中的问题不起作用

需要帮助吗？

不使用Position：sticky在水平滚动中使跨度粘

0 个答案: