Ankündigung

Einklappen
Keine Ankündigung bisher.

Anchor links

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Anchor links

    Hi,

    ich möchte intern von Seite A auf Seite B#anchor verlinken. Klicken ich den Link an, erhalte ich auf Seite B folgenden JS-Fehler:
    Code:
    Uncaught Error: Syntax error, unrecognized expression: .onepagenav a:not(.backlink)[href*=#anchor]
        at Function.fa.error (a03137b3b494.js:2)
        at fa.tokenize (a03137b3b494.js:2)
        at fa.select (a03137b3b494.js:2)
        at Function.fa [as find] (a03137b3b494.js:2)
        at n.fn.init.find (a03137b3b494.js:2)
        at new n.fn.init (a03137b3b494.js:2)
        at n (a03137b3b494.js:2)
        at HTMLDocument.<anonymous> (scripts.js:406)
        at i (a03137b3b494.js:2)
        at Object.fireWith [as resolveWith] (a03137b3b494.js:2)
    Gibt es hierfür eine einfache Lösung?

    Grüße,
    mapfei

  • #2
    Hyperlink Element: {{link_url::ID-DER-SEITE}}#meinAnker
    http://www.premium-contao-themes.com

    Kommentar


    • #3
      Genau so habe ich's gemacht, allerdings als Link im Fließtext:

      <a href="{{link_url::1234}}#anchor">Text</a>

      Beim Hyperlink-Element erhalte ich bei Aufruf folgenden Fehler:

      Code:
      Uncaught TypeError: Cannot read property 'top' of undefined
          at HTMLAnchorElement.<anonymous> (scripts.js:689)
          at HTMLAnchorElement.dispatch (a03137b3b494.js:3)
          at HTMLAnchorElement.r.handle (a03137b3b494.js:3)
      (anonymous) @ scripts.js:689
      dispatch @ a03137b3b494.js:3
      r.handle @ a03137b3b494.js:3
      Zuletzt geändert von mapfei; 19.07.2018, 13:42.

      Kommentar


      • #4
        Also der Sprung zum Anker funktioniert, jedoch wirft die Konsole eben o.g. Fehler aus und ich hätte gerne noch das SmoothScrolling für diese Ankerpunkte aktiviert.

        EDIT: SmoothScrolling innerhalb der Seite bekomme ich nun auch hin (nach Anpassung des Blocks "scroll to anchors" in scripts.js). Allerdings von Seite A zu Seite B#anchor wirft den unter #3 genannten Fehler.
        Zuletzt geändert von mapfei; 19.07.2018, 14:26.

        Kommentar


        • #5
          Dem Link die Klasse "no-anchor" geben, weil es kein Anker auf gleicher Seite ist. In einer Onepage-Navigation die Klasse "backlink"

          .onepagenav a:not(.backlink)[href*=#anchor]
          Das kommt zum Einsatz, wenn man auf einer Onepage Seite in der Url einen Anker hat. Es wird versucht das letzte aktive Element zu finden. Hier gibt es immer wieder Disparitäten zwischen Jquery Versionen. Wahrscheinlich ist es besser den Aufruf zu entkapseln:

          scripts.js, Zeile 406, ändern nach:

          Code:
          jQuery(".onepagenav a:not(.backlink)[href*=\\"+strHash+"]");
          Zuletzt geändert von Tim; 20.07.2018, 09:48.
          http://www.premium-contao-themes.com

          Kommentar


          • #6
            Würde dann so aussehen:
            Code:
            // jump to hashtag anchor in url
            var strHash = window.location.hash.toString();
            if(strHash.length > 0)
            {
            var target = jQuery(strHash);
            jQuery(strHash+' a').addClass('active');
            
            jQuery(".onepagenav a:not(.backlink)[href*=\\"+strHash+"]");
            lastActive.addClass('active');
            Bekomme dann aber immer noch einen Fehler:
            Code:
            scripts.js:407 Uncaught TypeError: Cannot read property 'addClass' of null
                at HTMLDocument.<anonymous> (scripts.js:407)
                at i (a03137b3b494.js:2)
                at Object.fireWith [as resolveWith] (a03137b3b494.js:2)
                at Function.ready (a03137b3b494.js:2)
                at HTMLDocument.K (a03137b3b494.js:2)
            EDIT: Ok, wenn ich Zeile 407 dann noch lösche, funktioniert's fehlerfrei. Allerdings: Aufruf Seite A zu Seite B#anchor funktioniert und scrollt auch. Innerhalb von Seite B scrollen die Anker dann aber nicht mehr.
            Zuletzt geändert von mapfei; 23.07.2018, 09:47.

            Kommentar


            • #7
              Gibts hierzu evtl. noch ein Feedback? Die Anker auf Seite B werden zwar "angesprungen", jedoch ohne Scroll-Effekt.

              Kommentar


              • #8
                Zitat von mapfei Beitrag anzeigen
                Gibts hierzu evtl. noch ein Feedback? Die Anker auf Seite B werden zwar "angesprungen", jedoch ohne Scroll-Effekt.
                Warum wird hier das Script für eine Onepage Seite angesprochen? Ist Seite B eine Onepage?

                http://www.premium-contao-themes.com

                Kommentar


                • #9
                  Zitat von Tim Beitrag anzeigen

                  Warum wird hier das Script für eine Onepage Seite angesprochen? Ist Seite B eine Onepage?
                  Ja. Im Menü stehen halt Dienstleistungen, welche dann auf einer Seite abgebildet werden und mit Ankern versehen sind.

                  Kommentar


                  • #10
                    Der Sprünge von Seite A zu Seite B mit Ankern soll ohne Scroll-Effekt stattfinden. (direkter Sprung) Sprünge innerhalb der Seite sind mit Scroll-Effekt belegt (wenn der Anker in einem der Bereiche liegt, die standardmäßig angesprochen werden. (scripts.js, ganz unten ist das Script)
                    http://www.premium-contao-themes.com

                    Kommentar


                    • #11
                      In beiden Fällen soll gescrollt werden.

                      Kommentar


                      • #12
                        Hi,

                        nun habe ich mit {{link_url::2721}}#philosophie und externen Links versucht Untermenüpunkte einzufügen. Sollten diese nicht auch scrollen? Tun sie jedenfalls nicht (Eclipse 3.0.8)

                        Grüße,
                        mapfei

                        Kommentar


                        • #13
                          Es scrollen nur Anker innerhalb der gleichen Seite.
                          http://www.premium-contao-themes.com

                          Kommentar


                          • #14
                            Helloooo, häng mich hier kurz thematisch dazu. Ich hab eine (Externe)-Weiterleitungs-Seite in der Hauptnavi eines Nicht-Onepagers mit einem Anker-link versehen.

                            Code:
                            {{link_url::2650}}#nav-portfolio
                            Beim Sprung von einer anderen Seite gibt es es kein Smooth-Scrolling, alles klar.
                            Von der gleichen Seite aus springt er aber auch "hart". 🤔
                            Normale Links und Buttons auf der Seite smoothen wunderschön.
                            Gibt es eine Möglichkeit das auch aus dem Hauptmenü heraus zu ermöglichen?

                            Kommentar


                            • #15
                              Das wäre dann eine richtige OnePage. Dafür steht das OnePage Navigations-Modul bereit.

                              Du kannst versuchen der Seite in den Seiten-Einstellungen die Klasse "onepage_page" geben. Die Hauptnavi könnte dann auf Anker mit Smooth-Scrolling reagieren.

                              Auch dem Menu die Klasse "onepagenav" geben, könnte es aktivieren.

                              Alternativ kann das allgemeine Scrollscript in der files/cto_layout/scripts/scripts.js des Themes, Zeile 750 erweitert werden (oder updatesicher in der customize.js ein eigenes zusätzliches Scrolling-Script hinterlegt werden)
                              Zuletzt geändert von Tim; 04.02.2022, 08:34.
                              http://www.premium-contao-themes.com

                              Kommentar

                              Lädt...
                              X