Nicki: jQuery Smooth-Scrolling funktioniert nicht mit Get-Parameter

Hi,

ich habe folgendes jQuery-Script zum Smooth-Scrolling zu Anchors. Das klappt prima. Sobald aber im Link noch ein Get-Parameter enthalten ist, wird dieser ignoriert und nur zum Anker gescrollt (z.B. href="/index?nr=01#anker")

BG
Nicki

  
    $(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;  
            }  
          }  
        });  
      });  
    
  1. Meine Herren,

    ich habe folgendes jQuery-Script zum Smooth-Scrolling zu Anchors. Das klappt prima. Sobald aber im Link noch ein Get-Parameter enthalten ist, wird dieser ignoriert und nur zum Anker gescrollt (z.B. href="/index?nr=01#anker")

    Du darfst das Skript nicht auf alle Links mit einem Hash-Teil (#) anwenden, sondern nur auf solche, die auf einen Anker innerhalb des aktuellen Dokuments zeigen. Das heißt du musst vorher prüfen, ob Teil des Verweises vor der Raute, identisch mit dem Teil vor der Raute des aktuellen Dokuments ist.

    Dein Skript unterbindet nämlich die Standard-Funktionalitäten von sämtlichen Links (return false;) , und nicht nur derjenigen, die auf Sprungmarken des aktuellen Dokuments verweisen.

    --
    Hey Girl,
    i wish you were asynchronous, so you'd give me a callback.
    1. Hi,

      Du darfst das Skript nicht auf alle Links mit einem Hash-Teil (#) anwenden, sondern nur auf solche, die auf einen Anker innerhalb des aktuellen Dokuments zeigen.

      Das zu checken, wird doch mit

      
      >           if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')  
      >               || location.hostname == this.hostname) {
      
      

      versucht.

      (Allerdings verstehe ich nicht, wofür das replacen von / durch nichts darin gut sein soll.)

      MfG ChrisB

      --
      RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
      1. Meine Herren,

        Du darfst das Skript nicht auf alle Links mit einem Hash-Teil (#) anwenden, sondern nur auf solche, die auf einen Anker innerhalb des aktuellen Dokuments zeigen.

        Das zu checken, wird doch mit

                   if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')  
        >               || location.hostname == this.hostname) {
        
        
        >   
        > versucht.  
        >   
        > (Allerdings verstehe ich nicht, wofür das replacen von / durch nichts darin gut sein soll.)  
          
        Verstehe ich auch nicht.  
        Diese Implementierung ist sowieso ungeeignet, weil es reicht wenn `pathname`{:.language-javascript} oder `hostname`{:.language-javascript} gleich sind.  
        Der Dokument-URL muss aber mit dem Link-URL in allen Punkten bis auf den Hash übereinstimmen.  
          
        In etwa:  
          
        `location.href.split('#')[0] === this.href.split('#')[0]`{:.language-javascript}  
        
        -- 
        Hey Girl,  
        i wish you were asynchronous, so you'd give me a callback.
        
  2. Meine Herren,

    ich habe jetzt zwei mal versucht den Bug (samt Lösungsvorschlag) in den Kommentaren zu veröffentlichen und er wurde 2 mal zurückgewiesen.

    Insbesondere folgender Fehler ist gefählich:

    Wir sind auf der Seite:

    http://example.com/foo

    Und verlinken auf

    https://example.com/foo#bar

    Nach dem wir den Link klicken, haben wir keine https-Verbindung.

    Der Umgang mit solchen Bug-Reports ist schlicht verantwortungslos.

    --
    Hey Girl,
    i wish you were asynchronous, so you'd give me a callback.