Bootstrap追加ナビゲーション(Affix)プラグインの問題と解決方法

使用 Bootstrap付加ナビゲーション(Affix)プラグインには様々な問題が発生しています.問題を解決する方法を記録して、参考にしてください.
★  Linkクリック後の位置ずれ 
    サイド・ナビゲーション・バーをクリックすると、ページに指定されたリンクがスクロールしすぎてトップ・ナビゲーション・バーに隠されます.これはAffixの問題ではなく、トップナビゲーションバーの固定位置の原因のようです.外層divに定義することもでき、これは自分で発揮する.
Cssコード 

/* Janky fix for preventing navbar from overlapping */  
h1[id] {  
  padding-top: 80px;  
  margin-top: -45px;  
}

 原理は、例えば35 pxの隙間が欲しいので、35 pxを直接書くことはできません.必要 top paddingは80 pxに設定され、トップナビゲーションバーの遮蔽を防止します.
 次にtop marginを-45 pxに設定し、35 pxの効果を達成します.
 
 ★  ページをスクロールするとサイズが変わります   もう1つの問題は、サイドナビゲーションバーが浮かび上がるとサイズが変わるページをスクロールすることです. 
  私の解決策はjsを使用して幅を動的に変更することです.
Htmlコード     追加ナビゲーションのコード構造 

<div class="row">
        <div class="col-xs-3" id="myScrollspy">
            <ul id="affix-ui" class="nav nav-tabs nav-stacked" data-spy="affix" data-offset-top="125">
                <li class="active"><a href="#section-1">    </a></li>
                <li><a href="#section-2">    </a></li>
                <li><a href="#section-3">    </a></li>
                <li><a href="#section-4">    </a></li>
            </ul>
        </div>
        <div class="col-xs-9">    </div>
</div>

JavaScriptコード 

<script>
//   
   $(function(){
      updateLogin(); //    
   });
//      
   window.onresize = function(){  
                updateLogin();
            }
//                
   function updateLogin() {
       $("#affix-ui").width($(".col-xs-3").width());
   };
</script>