ブートストラップ付きレスポンダーフッターはモバイルで完了しません

Question

私はこのワークフローを現在デスクトップに作成しようとしていますが、モバイルフッターではページの半分がすべての幅ではありません。

<footer class="footer"> 
     <div class="container "> 
     <div class="col-md-12 col-ms-12 col-xs-12 text-center"> 
      <ul class="social-network social-circle" > 
      <li><a href="#" class="icoinstagram infooter" title="instagram"><i class="fa fa-instagram"></i></a></li> 
      </ul> 
     </div> 
     </div> 
    </footer> 

とフッターのCSSは次のとおりです：モバイルでのフッターの

.footer{ 
    background:#434343; 
    height:200px; 
    margin-top:20px; 
    width:100% !important; 
    clear: both; 
    margin-right:0; 
    margin-left:0; 
} 

画像：

footer.blade.php

は、このコードを持っている

Answer 1

は、単にjQueryのを使用して、すべてのものを残します機能を.scrollTop()取得するスクロールのition。

フッターを表示したいときはいつでも、ちょうどこの操作を行います。

$("#whatever_footer_id").css("display":"visible"); 

非表示にするには：

$("#whatever_footer_id").css("display":"none"); 

使用このクラス：

.footer 
{ 
    position: fixed; 
    bottom: 0; 
    left: 0; 
    display: none; 
    width: 100%; 
    height: 200px; 
    text-align: center; 
    z-index: 999; 
}