is there a way to do a box that contains anchor href elements to link to specific div in a page that will follow the scroll bar ? any help please? I have tried to do this but it didn't scroll on all the page it is fixed.
<div id="sidebar">
<ul>
<li><a href="#d1">jQuery (animated)</a></li>
<li><a href="#d2">CSS (fixed)</a></li>
<li><a href="#d3">CSS (reveal)</a></li>
</ul>
</div>
<form id="form2" runat="server">
<a href="#" id="scrlBotm" class="follow-scroll" style="margin-left:95%; color:white;"><img src="arrow_down.png"></a>
<h1 style="text-align:center;" id="Patient" runat="server" ></h1>
<h2 style="text-align:center;">Step 1/10</h2>
<div id="d1">
<ul class="form-style-1">
<li id="d1"><label>Nom du Patient<span class="required">*</span></label><input type="text" runat="server" name="Name" id="Name" class="field-long" placeholder="First" /></li>
<li id="d2">
<label>Username         Password <span class="required">*</span></label>
<input type="text" runat="server" name="Username" id="Username" class="field-short" placeholder="Username" />
<input type="text" runat="server" name="password" id="password" class="field-short" placeholder="Password" />
</li>
</ul>
</form>
my j query :
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
<script type="text/javascript">
$(function () {
var offset = $("#sidebar").offset();
var topPadding = 15;
$(window).scroll(function () {
if ($(window).scrollTop() > offset.top) {
$("#sidebar").stop().animate({
marginTop: $(window).scrollTop() - offset.top + topPadding
});
} else {
$("#sidebar").stop().animate({
marginTop: 0
});
};
});
});
</script>