手机导航菜单固定到顶部无效果

Question

https://developer.mozilla.org...

Answer 1

以下代码影响了定位

.mmenu-accelerated .mmenu-page, html.mmenu-accelerated #mmenu-blocker {
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

方法一：就一个swiper轮播图，没必要硬件加速了，直接去掉即可
方法二：把要定位的元素移到这些个元素外面去

Answer 2

mmenu-page的transform属性对position属性产生了影响 可以把m-nav放在mmenu-page外面

Answer 3

点击前#page

position:fixed;
top:0px;
left:0px;
width:100%
z-index:500;

点击导航后#page设为 position: relative;

Answer 4

element.style{
position:fixed;

z-index:999;
width:100%;
height:100%;
top:0px !important;
left:0px !important;

}

Answer 5

http://www.zhangxinxu.com/wor...
第三部分

Answer 6

If the property has a value different than none, a stacking context will be created. In that case the object will act as a containing block for position: fixed elements that it contains.

所以去掉外层transform，#page添加position:fixed相关设置即可。
https://developer.mozilla.org...