• Guten Abend Zusammen,

    ich würde gerne auf meine Webseite das sogenannte Smooth Scroll haben. (langsames scollen von Ankern).
    Leider funktioniert das ganze irgendwie nicht so richtig und ich weiß nicht an was das ganze liegt...:confused:

    Hier mal ein Beispiel: http://unfold.no/#/people

    ich benutze folgenden Code:

    <!-- jQuery enbinden von Google-->
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
    // jQuery laden
    google.load("jquery", "1.3.2");
    </script>


    <!-- jQuery Code -->
    <script type="text/javascript">


    $(document).ready(function() {
    // Alle internen Links auswählen
    $('a[href*=#]').bind("click", function(event) {
    // Standard Verhalten unterdrücken
    event.preventDefault();
    // Linkziel in Variable schreiben
    var ziel = $(this).attr("href");
    //Scrollen der Seite animieren, body benötigt für Safari
    $('html,body').animate({
    //Zum Ziel scrollen (Variable)
    scrollTop: $(ziel).offset().top
    // Dauer der Animation und Callbackfunktion die nach der Animation aufgerufen wird, sie stellt das Standardverhalten wieder her und ergänzt die URL
    }, 2000 , function (){location.hash = ziel;});
    });
    return false;
    });
    </script>


    Eigl. müsste jetzt doch jeder Anker auf der Webseite langsam runterscollen....dies tun sie alledings nicht. Ich weiß langsam echt nichtmehr was ich och machen könnte -.-

    Ich bitte um eure Hilfe! :)

  • In deinem Codestück habe ich jetzt keinen Fehler entdeckt.
    Hast du denn im href deiner Menüpunkte auch die gleiche ID verwendet die du dann an deiner "Sprungmarke" als ID vergeben hast?
    z.B:
    im Menü: <a href="#punkt1">Punkt1</a>

    die betreffende Stelle auf deiner Seite wo hingescrollt werden soll: <div id="punkt1">BLABLABLA</div>

    Ich hoffe ich konnte dir helfen.
    Viele Grüße
    Nadja

  • Vielen Dank erstmal für den Tipp!

    Nun funktioniert zwar das langsame runterscrollen, jedoch nur wenn ich den Link zum Anker am Rand Positioniere (ab einer bestimmten Linie erkennt er die Verlinkung nicht mehr :() Hat das was mit diesem "Margin" zu tun?

    Hier mal der Code für eine kleine Testseite (also quasi nur die Problemseite mit dem Anker):