Diesen Code fügst du in den Headbereich deiner Seite ein:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript">
</script>
<script type="text/javascript">
//<![CDATA[
$(function() {
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') ==
this.pathname.replace(/^\//,'') && location.hostname ==
this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' +
this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
} }
}); });
//]]>
</script>
Deine Unterseiten-Bezeichnung vergibst du je nach dem wo du nach dem Klick auf deinem Onepager landen möchtest. Anschließend verlinkst du diese jeweils, wie zum Beispiel /#about. Bei der Unterseite other würdest du so verlinken /#other.
Zuletzt musst du noch die Sprungmarken setzen, also jeweils über dem Element wo du, per Klick auf der Navigation, landen möchtest.
Hier das Beispiel für den Punkt about.
<a id="about" name="about"></a>