LinkedIn homepage middle section scrollable

right and left side is fixed after certain time.

by vaheed akhtar

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<div class="container">
  <nav class="col-xs-3">
    <div data-spy="affix" >
     <h2>Tab1</h2>
     <h2>Tab1</h2>
     <h2>Tab1</h2>
    </div>
  </nav>
  
  <div class="col-xs-6">
   <div id="one" class="text-center">
   <h1>One</h1>
   <p>Technology is the practical use of science, including the making, modification or improvement, applied activity or behavior, use and knowledge of tools, machines.</p>
   </div>
   <div id="two" class="text-center">
   <h1>Two</h1>
   <p> or environmental modifications or arrangement in order to solve a problem, improve a preexisting solution to a problem, achieve a goal or perform a specific function. It can also refer to the collection of such tools,</p> 
   </div>
   <div id="three" class="text-center">
   <h1>Three</h1>
   <p>techniques, crafts, systems, methods of organization, or environmental modifications or arrangement in order to solve a problem, improve a</p> 
   </div>
   <div id="four" class="text-center">
   <h1>Four</h1>
   <p>Technology is the practical use of science, including the making, modification or improvement, applied activity or behavior, use and knowledge of tools, machines, techniques, crafts, systems, methods of organization, or environmental modifications or arrangement in order to solve a problem, improve a preexisting solution to a problem, achieve a goal or perform a specific function. It can also refer to the collection of such tools</p> 
   </div>
  </div>
  <nav class="col-xs-3" id="navHead">
    <div data-spy="affix" >
     <h2>Right1</h2>
     <h2>Right2</h2>
     <h2>Right3</h2>
    </div>
  </nav>
  
  
</div>

CSS

#one, #three{height:500px;background:lightgreen;color:white;font-size:25px;}
#two, #four{height:500px;background:blue;color:white;}
.nav{
  background-color:grey;
}

JavaScript

/* $(document).ready({
  $(.)
}) */