Bootstrap 3 navbar在ios中滚动时未固定到底部

我正在使用-viewport-overflow-scroll：touch;溢出：自动;能够在ios中使用动量滚动，但我遇到了bootstrap导航栏的问题。当我在ios中滚动时，导航栏停留在页面中间，直到我停止滚动，然后几秒钟后它再次粘到页面底部。有任何想法吗？导航栏在滚动触摸的div内。这是导航栏：Bootstrap 3 navbar在ios中滚动时未固定到底部

<nav class="navbar navbar-fixed-bottom footer"> 
    <div class="pull-left footer-text"> 
     <span>All rights reserved</span> 
    </div> 
    <div class="pull-right footer-icons"> 
     <img class="footer-icon" /> 
     <img class="footer-icon" /> 
    </div> 
</nav> 


.footer{ 
min-height:1em; 
bottom:0; 
background-color: #35AEEE; 
right: 0; 
left: 0; 
color: white; 
}

来源

2017-02-23 lin001

既然你有bottom: 0;，你可以添加position: absolute;属性，使其附着在页面的底部。

.footer { 
 
    min-height: 1em; 
 
    bottom: 0; 
 
    background-color: #35AEEE; 
 
    right: 0; 
 
    left: 0; 
 
    color: white; 
 
    position: absolute; 
 
}

<nav class="navbar navbar-fixed-bottom footer"> 
 
    <div class="pull-left footer-text"> 
 
    <span>All rights reserved</span> 
 
    </div> 
 
    <div class="pull-right footer-icons"> 
 
    <img class="footer-icon" /> 
 
    <img class="footer-icon" /> 
 
    </div> 
 
</nav>

来源

2017-02-23 15:51:43 Hewlett

是的，我已经试过了，但是当我添加的位置是：绝对的;它只能粘贴页面底部的位置，当页面首次加载时 – lin001

已解决。在-viewport-overflow-scroll：touch里面不可能有一个固定的元素。看看这个https://remysharp.com/2012/05/24/issues-with-position-fixed-scrolling-on-ios – lin001

很好找，谢谢分享！ – Hewlett

Bootstrap 3 navbar在ios中滚动时未固定到底部

回答

相关问题