Anchor links

[mapfei]

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:

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

[Tim]

Hyperlink Element: {{link_url::ID-DER-SEITE}}#meinAnker

[mapfei]

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:

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

[mapfei]

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.

[Tim]

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:

jQuery(".onepagenav a:not(.backlink)[href*=\\"+strHash+"]");

[mapfei]

Würde dann so aussehen:

// 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:

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.

[mapfei]

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

[Tim]

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?

[mapfei]

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.

[Tim]

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)

[mapfei]

In beiden Fällen soll gescrollt werden.

[mapfei]

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

[Tim]

Es scrollen nur Anker innerhalb der gleichen Seite.

[AdrianPiwo]

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.

{{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?

[Tim]

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)