<div class="container">

    <div class="col-md-3">

        <ul class="list-group affixed-element-top js-affixed-element-top">

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

        </ul>

    </div>

    <div class="col-md-6 js-content">

        <p>段落</p>

        <p>段落</p>

        <p>段落</p>

        <p>段落</p>

        <p>段落</p>

    </div>

    <div class="col-md-3">

        <ul class="list-group affixed-element-bottom js-affixed-element-bottom">

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

            <li class="list-group-item">hello</li>

        </ul>

    </div>

</div>

<script>

    // $('.collapse').collapse()

  $(function(){

     $(".js-affixed-element-top").affix({

        offset: {

        }

     });

     $(".js-affixed-element-bottom").affix({

      offset: {

      }

     });

  });

</script>

<style>

        .affixed-element-top.affix{

            top:10px

        }

        .affixed-element-top.affix-bottom{

            position: relative;

        }

        .affixed-element-bottom.affix{

            bottom:10px

        }

        .affixed-element-bottom.affix-bottom{

            position: relative;

        }

    </style>