css粘性定位-实现商城类目滚动的标题吸附
传统的粘性定位是通过js计算高度来实现的。当元素滚动到某个位置时，它会被吸附在当前位置。下面我们通过css实现粘性定位功能。Sticky定位Sticky定位目前所有主流浏览器都支持。顾名思义，粘性定位有吸附的作用。其实就是position的一个新属性。语法：位置：粘性；top值捕捉到父元素的指定位置。粘性定位须知：1.粘性定位元素发生偏移时，会保留元素的原位置。2.如果粘性定位里面有绝对定位的子元素，那么子元素的绝对定位指向的是偏移位置，而不是原来的位置。3.sticky定位可以通过z-index改变堆叠顺序。下面是粘性定位的实现：Sweepstakes
="emptyChunk"v-for="(item,index)in6">Content:{{index}}
.topSticky{width:240px;高度：30px；文本对齐：居中；行高：30px；顶部边距：30px；边框：1px纯红色；背景色：#80c342；定位：粘性；/*粘性定位*/top:0;/*具体父元素吸附距离*/}.emptyChunk{height:200px;宽度：240px；border:1pxsolidgreen;}如果父元素不存在，默认指向web窗口。粘性定位偏移量是相对于父元素计算的，其效果仅在父元素内部滚动时才会体现，粘性定位的父元素不一定是直接父元素。距离粘性定位最近的滚动元素就是粘性定位的目标，只要粘性定位元素的父级（div1:overflow:scroll;->div2->div3->div4:sticky）发生滚动，那么当前的粘性定位将指向发生滚动的最近的父元素(div4->div1)。顶层粘性定位：粘性定位默认定位是parent。如果父元素不存在，则默认指向网页窗口的粘性约束矩形。如果粘性定位元素的高度>=父元素的高度，那么粘性定位的效果就会失效。在上面的例子中，蓝色矩形是橙色矩形的父级。蓝色矩形构成粘性定位矩形。橙色粘性定位指向滚动的红色边框框。当红色框向内滚动时，橙色矩形在滚动到距离红色框顶部20px时吸附，继续滚动，蓝色矩形的高度会逐渐变小，当橙色矩形的高度>=高度时蓝色矩形，粘性定位会失效，继续滚动时，橙色矩形会随着滚动消失。
