In the middle of a long page I have several dynamically created anchors with code like that:
// retrieve elements data from the db;
// put them into array $elements_arr
$how_many_elements = count($elements_arr);
for ($i = 1; $i <= how_many_elements; $i ++) {
echo "<a name='element_" . $i . "'>";
// some content here
}
At the top of the page I have a table with cells containing little images with dynamically created links to the anchors, like this:
echo "<table class='tab1'>";
echo "<tr>";
for ($a=1; $a<=how_many_elements; $a++) {
echo "<td class='tdx'>";
echo "<a href='#element_" . $a . "'><img id='element_img_" . $a . "' name='element_img_" . $a . "'src='path_to_img" . strtolower($image_name_arr[$a-1]) . ".png'></img></a>";
echo "</td>";
}
echo "</tr>";
echo "</table>";
Now, the html links work fine, but I would like to have a smooth scroll to each anchor instead of a jump. How can I do it, with and without JQuery?