PhP automatisch Runterscrollen OnePage

[OpenMedia]

Hallo zusammen,
ich habe folgende Navigation

<div id="page">
<nav class="fh5co-nav" role="navigation">
<div class="top-menu">
<div class="container">
<div class="row">
<div class="col-xs-10 text-right menu-1">
<ul>
<li class="active"><a href="index.html">Button1</a></li>
<li><a href="Hallo.php">Button2</a></li>
<li><a href="Test.php">Button3</a></li>
<li><a href="Welt.php">Button4</a></li>
<li><a href="studio.php">Buttton5</a></li>
<li><a href="ww.php">Button6</a></li>
<li><a href="kontakt.php">Button7</a></li>
<li><a href="about.html">Button8</a></li>
<li class="btn-cta"><a href="sr"><span>Button9</span></a></li>
</ul>
</div>
</div>
				
</div>
</div>
</nav>

Nun möchte ich z.B. wenn ich auf Button7 klicke das er bis zu einem bestimmten Punkt auf der Website runterscrollt.
Ist das möglich ?
Danke im Voraus

 

[Jesterfox]

Gib dem bestimmten Punkt eine ID (z.B. <div id="eineId">) und schreib beim Button 7 dann href="#eineId".

 

[andy_m4]

Du brauchst sogenannte Anker.
http://wiki.selfhtml.org/wiki/HTML/Links/Seiteninterne_Verweise

Das hat übrigens nichts mit PHP zu tun, sondern mit HTML.

 

[DaZpoon]

Das mit den Ankern funktioniert auch bei verlinkten Seiten, einfach anhängen:

<a href="ziel.htm#anchorID">...</a>

// Mit GET-Parametern
<a href="ziel.php?param1=X&param2=Y#anchorID">...</a>

 

[OpenMedia]

Hay irgendwie funktioniert das nicht ?
Ich habe jetzt folgendes gemacht :

<li><a href="#1">Button7</a></li>

<div id="#1">
...
...
...
</div>

 

[Jesterfox]

Bei der ID darf das # nicht mit dran stehen, das gehört nur in den HRef um Anzuzeigen das auf einen Anker gesprungen werden soll. (und IDs dürfen glaub ich auch nicht mit Ziffern anfangen, oder wurde das bei HTML5 geändert?)

 

[OpenMedia]

Vielen Dank hat jetzt funktioniert .

Vielen Dank Ihr Lieben

Ergänzung (24. Januar 2017)

Vllt noch eine Mini Frage ist es auch möglich mit einem Scrolleffekt ?

 

[Jesterfox]

Man könnte zusätzlich noch ein JavaScript draufhängen dass das macht, mit einem direkten Beispiel kann ich jetzt nicht dienen, aber über Google sollte sich was finden lassen ;-)

 

[gaym0r]

Am besten du nimmst dafür jquery.

jquery als solches in das Dokument einbinden:

<script src="http://code.jquery.com/jquery-latest.js"></script>

Script zum scrollen:

function scrollToAnchor(aid){
    var aTag = $("a[name='"+ aid +"']");
    $('html,body').animate({scrollTop: aTag.offset().top},'slow');
}

scrollToAnchor('id3');

Weitere Hilfe: http://www.html-seminar.de/jquery-tutorial.htm