滚动图像upto div内容没有位置：粘

我想要图像在div内上下滚动。当使用chrome而不是IE，Edge或Firefox时，位置粘性工作。滚动图像upto div内容没有位置：粘

HTML

<section class="container"> 
    <div class="row"> 
     <div id="stamp-img" class="col-md-6"> 
      <img src=""> 
     </div> 
     <div class="col-md-6"> 
     </div> 
    </div> 
</section>

CSS

#stamp-img { 
    position: sticky; 
    top: 35%; 

    img { 
     margin: 50px 0px; 
    } 
}

来源

2017-08-28 Yh1234

为什么不使用固定？正如其他答案中所述，Sticky具有跨浏览器兼容性问题。

#stamp-img { 
 
    /* changed to fixed */ 
 
    position: fixed; 
 
    top: 35%; 
 
    /* new */ 
 
    height: 100px; 
 
    overflow: auto; 
 
    /* end new */ 
 
    img { 
 
    margin: 50px 0px; 
 
    } 
 
}

<section class="container"> 
 
    <div class="row"> 
 
    <div id="stamp-img" class="col-md-6"> 
 
     <img src="https://placehold.it/500x500"> 
 
    </div> 
 
    <div class="col-md-6"> 
 
    </div> 
 
    </div> 
 
</section>

来源

2017-08-28 17:38:54 Syden

试图使用固定的。我跑的问题是，不是那个div容器，它会从整个内容的顶部到底部滚动。 – Yh1234

虽然这有帮助吗？因为按照上面的例子，它应该工作正常，否则如果你可以提供更广泛的场景，我可以尝试从那里帮助你。 – Syden

是啊帮助我或正确的道路。所以我使用了col-md-6，因此左侧有图像，右侧有描述。需要弄清楚如何正确对齐，因为固定会使图像处于描述的前面。也似乎固定应用于HTML的主体，而不是仅仅是父级包装部分。 – Yh1234

“粘性性质是，不应该在生产代码中使用的实验API”

=>https://developer.mozilla.org/en-US/docs/Web/CSS/position

来源

2017-08-28 17:34:55 Christian

滚动图像upto div内容没有位置：粘

回答

相关问题