<div class="row">
<div class="col s12 m9 l10">
<div id="HTML5" class="section scrollspy">
<div class="card-panel green">
<h4>HTML5 Tutorial</h4>
<p>HTML5 (No space between "HTML" and "5")is a markup language used for structuring and presenting content on the World Wide Web. It is the fifth and...</p>
</div>
</div>
<div id="CSS3" class="section scrollspy">
<div class="card-panel blue">
<h4>CSS3 Tutorial</h4>
<p>The CSS was started to develop around 1998. And till 2009, it was under development. The first working draft of CSS3 came in 19-01-2001. but it was initially....</p>
</div>
</div>
<div id="Bootstrap4" class="section scrollspy">
<div class="card-panel cyan">
<h4>Bootstrap 4 Tutorial</h4>
<p>Bootstrap 4 alpha 1 was released on 19th August 2015. Since then there have been many alpha releases. And finally after that on 10th August 2017, ...</p>
</div>
</div>
<div id="MD_CSS" class="section scrollspy">
<div class="card-panel red lighten-1">
<h4>Materialize CSS Tutorial</h4>
<p>Materialize is a User Interface (UI) component library. Introduced by Google (2014 – Present), Material Design is a language that combines the classic principles ....</p>
</div>
</div>
</div>
<div class="col hide-on-small-only m3 l2">
<ul class="section table-of-contents right-align" style="padding-top:250px; position:fixed;">
<li class="left-align"><a href="#HTML5">HTML5</a></li>
<li class="left-align"><a href="#CSS3">CSS3</a></li>
<li class="left-align"><a href="#Bootstrap4">Bootstrap</a></li>
<li class="left-align"><a href="#MD_CSS">Materialize</a></li>
</ul>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.scrollspy').scrollSpy();
});
</script>
$(document).ready(function(){
$('.scrollspy').scrollSpy();
});