Smooth Scroll und Sprachen URL

Nutzt jemand von euch das Smooth Scroll Script von cferdinandi ?
Ich habe damit ein spezielles Problem und zwar gibt es in den Optionen die Möglichkeit

PHP-Code:

---

updateURL: true, // Update the URL on scroll 


---

Ich habe eine Installation mit mehreren Sprachen und das Sparchkürzel in der URL also sieht eine URL z.B. so bei mir aus

HTML-Code:

---

http://example.com/en/

---

Wenn ich jetzt einen Ankerlink einrichte dann soll nach Klicken desselbigen mit der o.g. Script Option, so etwas herauskommen

HTML-Code:

---

http://example.com/en/#anker

---

Das klappt aber nicht denn das Sprachkürzel wird nach dem Klick auf den Ankerlink "rausgeschmissen" und die URL sieht dann so aus

HTML-Code:

---

http://example.com/#anker

---

das führt bei Klick auf einen weiteren Ankerlink dazu dass die Seite neu geladen wird weil der Anker ja wieder auf

HTML-Code:

---

http://example.com/en/#anker

---

verweist.

Ohne die Sprachkürzel Funktion geht es einwandfrei , leider ist die aber in meinem Fall erwünscht.
Das man auch ein anderes Script nehmen kann ist klar, hatte ich auch, aber dieses hier bietet eben noch einige andere Möglichkeiten die ich gerade für Onepages ganz nützlich finde

Kann ja sein, dass jemand dieses Script ebenfalls einsetzt und das Problem kennt und/oder lösen konnte.

Grüße
Bennie

Ich kenne dieses smooth-scroll nicht, aber schau dir bitte nochmal genau im Quelltext die HREFs in deinen Links an. Die dürften eigentlich nicht

Code:

---

http://example.com/en/#anker

---

sondern z.B. so lauten

Code:

---

en/contact.html#anker

---

http://example.com/en/, http://example.com/de/ wäre ja immer die Startseite (index.html)

Zusätzlich müsstest du einen BASE-Tag im HEAD haben, der so aussieht

HTML-Code:

---

<base href="https://example.com/">

---

Wenn dein BASE und deine HREFs so aussehen wie oben von mir beschrieben und es dann immer noch nicht funktioniert, würde ich an deiner Stelle im Ticketsystem danach fragen.

Beachte auch: Normalerweise (wenn man kein BASE im HEAD hat) reicht ein

HTML-Code:

---

href="#anker"

---

egal ob du gerade auf

• example.com
• example.com/en/
• example.com/en/contact.html

bist. Der Browser bleibt immer auf der gleichen Seite im gleichen Ordner. Hast du aber ein BASE, dann wird ein

HTML-Code:

---

href="#anker"

---

immer auf BASE-HREF#anker verweisen z.B. https://example.com/#anker. Egal auf welcher Seite/Ordner du bist.

BTW, mit dem Insterttag {{env::request}} kann man die aktuelle Seite/Ordner vor den Anker schreiben

Code:

---

{{env::request}}#anker

---

Zitat:

---

Ich kenne dieses smooth-scroll nicht, aber schau dir bitte nochmal genau im Quelltext die HREFs in deinen Links an. Die dürften eigentlich nicht
http://example.com/en/#anker

sondern z.B. so lauten

---

Ja aber auf der Startseite sehen die so aus, und auf anderen Seiten wie von Dir beschrieben, also so

PHP-Code:

---

example.com/en/contact.html#anker 


---

und ich habe u.a. auch

PHP-Code:

---

{{env::request}}#anker 


---

genutzt aber das ändert ja nichts.

Ich hatte das Problem neulich schon bei einer Onepage die ich mithilfe des Moduls Artikelliste (als Navigation) erstellt hatte, dort passierte genau dasselbe.

Hast du mal ohne das Smooth-Scroll probiert? Bei mir in der Demo geht das Anspringen auf der Startseite mit diesen Möglichkeiten:

BASE: https://example.org/

HREF:

• #footer
• en/#footer
• https://example.org/#footer
• https://example.org/en/#footer

In allen Fällen steht in der Address-Bar im Firefox nachher https://example.org/en/#footer.

Hast du sichergestellt, dass der Alias deiner ersten Seite "index" heißt?

Ja index ist vergeben - und all diese Möglichkeiten klappen bei mir auch ohne das Script.
Ich habe mal mit diesem getestet:

HTML-Code:

---

<script>
$(document).ready(function(){
  $('a[href*="#"]').on('click', function(event) { 
    if (this.hash !== "") {
   
          event.preventDefault();
         
      var hash = this.hash;
     
      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

        window.location.hash = hash;
      });
    }
  });
});
</script>

---

das klappt gut aber mit dem Offset bekomm ich das nicht entsprechend hin in Verbindung mit einer fixed Navigation.

Mein Ziel ist eigentlich:
Smooth Scroll mit Anker in der URL nach Klick , dann muss es zum entsprechenden Anker scrollen und auch noch eine Offset Funktion haben,
da die Navigation beim nach unten scrollen bei >200px zu einer fixed Navigation wird - also muss ein entsprechendes Offset berechnet werden.

Ich hatte das schon mit der jquery .offset() probiert, das führte aber dazu dass zwar zu richtigen Stelle gescrollt wird aber sobald der Anker dann an die URL gehängt wird
zuckt es und rutscht doch wieder ohne das Offset nach oben.

Hier 2 Snippets aus meinem Fundus.

Anchornav:

PHP-Code:

---

anchornav.find('a').on('click', function(ev) {
  ev.preventDefault();
  $('html, body').animate({
    scrollTop: $($(this).prop('hash')).offset().top - $('header').outerHeight() - 30
  }, 400);
}); 


---

Das hier von j_accordion-extended.html5:

PHP-Code:

---

...
activate: function(event, ui) {
  ...
  /** Scroll active accordion to top */
  if(ui.newHeader.length > 0) {
    var
      previousTogglerHeight = ui.newHeader.closest('.ce_accordion').prev('.ce_accordion').find('.toggler').outerHeight() || 0,
      previousAccordionMarginBottom = parseInt(ui.newHeader.closest('.ce_accordion').prev('.ce_accordion').css('margin-bottom')) || 0
    ;

    if(previousTogglerHeight)
    {
      $('html, body').animate({scrollTop: ui.newHeader.offset().top - previousTogglerHeight - previousAccordionMarginBottom - 5}, 300);
    }
  }
  /** Scroll active accordion to top - END */
}
... 


---

Vielleicht kannst du dir da was abschauen. In der Konsole auch immer nach JS-Fehlern Ausschau halten.

Das hier ist bestimmt falsch.

PHP-Code:

---

$(hash).offset().top
console.log(hash); 


---

Ich glaube in hash ist die Raute "#" nicht mit drin.