javascript - ブートストラップポップオーバーを固定ボタンと一緒に移動させる方法

Question

ページをスクロールすると、ポップオーバーが固定ボタンと一緒に移動するという動作を実現したかったのです。次のJS、CSS、およびHTMLがあります。

$(function () {
    $("#btn-pop").popover('show');            
});

h1{
    color:Silver;
}
#btn-pop{
    z-index: 1;
    position: fixed;
    top: 47%;
    left: 0;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">

        <!--These are some contents-->
        <div class="row">            
                <h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, optio corporis quae nulla aspernatur in alias at numquam rerum ea excepturi expedita tenetur assumenda voluptatibus eveniet incidunt dicta nostrum quod?</h1>                                               
        </div>
        <div class="row">
            <h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, optio corporis quae nulla aspernatur in alias at numquam rerum ea excepturi expedita tenetur assumenda voluptatibus eveniet incidunt dicta nostrum quod?</h1>                                   
        </div>
        <div class="row">
            <h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, optio corporis quae nulla aspernatur in alias at numquam rerum ea excepturi expedita tenetur assumenda voluptatibus eveniet incidunt dicta nostrum quod?</h1>                                   
        </div>
        <div class="row">
            <h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, optio corporis quae nulla aspernatur in alias at numquam rerum ea excepturi expedita tenetur assumenda voluptatibus eveniet incidunt dicta nostrum quod?</h1>                                   
        </div>

        <div class="row">
            <h1>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, optio corporis quae nulla aspernatur in alias at numquam rerum ea excepturi expedita tenetur assumenda voluptatibus eveniet incidunt dicta nostrum quod?</h1>                                   
        </div>

        <!--This is main thing--> 
        <button id="btn-pop" rel="popover" type="button" class="btn btn-primary" data-original-title="Setting" data-content="Check this amazing feature">
                <span class="glyphicon glyphicon-cog"></span>
        </button>

    </div>

上記のコードで、私が実際に達成したかったことを理解していただければ幸いです。前もって感謝します。

あなたは問題を見ることができます：