Anker Problem

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Hallo Leute,

nachdem ich im Web keine abgehandelte Lösung für mein Problem finden konnte, möchte ich es mal hier im Forum versuchen. Ich habe folgendes Problem:

Im Footer einer Seite habe ich die Menüpunkte a) "Impressum", b) "Datenschutz", und c)"Haftung". a) verweist direkt auf die Seite, b) und c) verweisen auf ihren jeweiligen Anker der Seite:

…/impressum/#!/anker_datenschutz
…/impressum/#!/anker_haftung

Das funktioniert problemlos. Problem aber nun: Wenn ich mich bereits auf der Seite a) befinde und b) oder c) klicke, so springt die Seite erst zum Anker, lädt dann die Seite neu und springt dann erneut zum Anker.

Damit wird natürlich genau das ausgeführt, was ich per Code vorgegeben habe. Aber gibt es möglicherweise irgendeinen Trick, wie ich das erneute Laden der Seite verhindern kann und einfach nur zum Anker gesprungen wird oder muss ich mit dieser Unzulänglichkeit leben?

Danke für Wissen oder kreative Vorschläge!!!
meisterleise
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
2 Fragen:
Warum benutzt du Hashbangs?
Benutzt du Javascript (z.B. Smooth-Scrolling)?

Edit:
Frage 1 erübrigt sich eigentlich, weil du (sofern es keinen guten Grund für die Hashbangs gibt) einfach normale Anker ( # ) verwenden kannst. Hashbangs lösen nunmal einen Page-Reload aus.
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
1. Hashbangs: ehrlich gesagt, ich weiß auch nicht, warum ich sie eingesetzt habe. :rolleyes:
2. Ja, Verwende ein WordPress Theme mit Smooth Scrolling

okay, habe es nun durch normale Anker ersetzt. Das Problem des Neuladens wird dadurch aber nicht gelöst, was ja auch logisch erscheint, oder?

Edit: ohne #! kein smooth scrolling. Darum die hashbangs.
 
Zuletzt bearbeitet:

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
Edit: ohne #! kein smooth scrolling. Darum die hashbangs.
Na das ist aber ein schlechtes Script dann!
Hier mal als Beispiel eins, das funktioniert (kannst du auch benutzen):

Code:
(function ($) {
    var $a = $("a");
    var $bodyHead = $('html, body');


    $a.on('click', function (event) {
        function scroll() {
            if (this.hash !== "") {
                event.preventDefault();
                $bodyHead.animate({
                    scrollTop: amount
                }, 1700);
            }
        }


        var amount = $(this.hash).offset().top;
        scroll();
        return;
    });
    return;
})(jQuery);
und das mit normalen Hashes
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Code reinschicken eher nicht, dafür habe ich zu wenig Ahnung davon (bin kein Programmierer, sondern nur ein Theme-Rumbastler). Link ist etwas heikel, weil die Site noch nicht online ist. Hier also der Link, den ich aber nachher wieder rausnehme: link entfernt

Edit: im Moment ist Datenschutz mit # und Haftung mit #!
 
Zuletzt bearbeitet:

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Danke für den Code!!
Bezweifel allerdings, dass ich herausfinde, wo ich das im Theme austauschen könnte.
Wie gesagt: zu wenig Ahung, sorry. :/
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
Ah ok. Problem gelöst:
Du hast eine Pfadangabe gemacht, der zwar auf den gleichen Teil deiner Seite führt, jedoch eine Pfadangabe ist.
Pfadangaben sind für den Browser eine neue Seite. Dementsprechend wird neugeladen. Das kannst du verhindern, indem du einfach aus deinen Pfadangaben sowas hier machst:
aus "…/impressum/#!/anker_datenschutz" wird "#anker_datenschutz".

Du musst dem Punkt, an den er springen soll dann eine id zuweisen. Das könnte so aussehen:
<div id="anker-datenschutz>
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Nein, ich muss doch eine Pfadangabe machen! Schließlich befindet sich der Link im Footer und ich muss von jeder anderen Seite auf den Anker der Impressumsseite zugreifen!

Deine Version funktioniert ja nur innerhalb der Seite!
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Aber ich seh schon. Dass, was ich will, kann nicht funktionieren. Lässt sich mit html wohl nicht umsetzen.
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
Wenn du auf andere Seiten zugreifen willst, dann kann die Pfadangabe auch so aussehen:
…/impressum#anker_datenschutz
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
Okay pass auf:
Verändere mal "/impressum/#!/anker_haft" zu "#!/anker_haft" auf der Impressumseite.
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Wenn du auf andere Seiten zugreifen willst, dann kann die Pfadangabe auch so aussehen:
…/impressum#anker_datenschutz
Geht auch, ändert aber nichts am neu laden.

Okay pass auf:
Verändere mal "/impressum/#!/anker_haft" zu "#!/anker_haft" auf der Impressumseite.
Befinde mich ja im Footer. Wenn ich es dort ändere wird der Anker von einer anderen Seite aus nicht mehr gefunden.
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
Kann es sein, dass wenn du den Footer veränderst, er auf allen anderen Seiten gleich mitveränderst (durch Wordpress, nicht durch dich direkt)?

Edit:
Denn wenn du "#!/anker_haft" versuchst, geht es nur auf der Impressumseite, aber auf anderen nicht. Wenn du es zu dem anderen veränderst, funktioniert es woanders, aber nicht auf der Impressumseite.
Desweiteren ist mir aufgefallen, dass die Änderung auf allen Seiten auftritt und nicht nur auf einer. Deswegen der Gedanke der oben genannt wurde.
 
Reactions: meisterleise

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Ja klar. Der Footer ist universell - ist ja irgendwie auch der Sinn eines Footers. ;)
Wenn ich den Footer nur für die Impressumsseite ändern könnte – stimmt, dann hätte ich das Problem nicht und mich hier nicht gemeldet.

Ich kann nochmal nachschauen, ob es irgendeine Möglichkeit gibt, nur für eine bestimmte Seite einen anderen Footer einzusetzen. Aber sowas ist mir bisher nicht bekannt.
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Also ich würde mal abschließend feststellen: Das, was ich mir vorgestellt hatte, geht nicht.
Dennoch hattest du, Aaron3219, die richtige Fährte gelegt: Die Seite bräuchte einen eigenen Footer.
Ob und wie ich das in WordPress umgesetzt bekomme, muss ich noch prüfen.

Vielen Dank auf alle Fälle für deinen tollen Einsatz!!! :)
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
Als abschließendes Statement:
Ich glaube wir haben zu Anfang aneinander vorbei geredet. Ich glaubte, du bearbeitest den Footer auf einer Seite und war deshalb ein bisschen verwirrt, warum es auf anderen dann nicht ging usw.
Es gibt dennoch eine Lösung des Problems, sofern du Javascript einbinden kannst (wovon ich zu 100% ausgehe).
Würdest du mir da noch einmal dein Vertrauen schenken?
 

meisterleise

Neues Mitglied
2 Februar 2018
21
1
3
38
Klaro, fühl dich ungezwungen, bin immer bereit ewtas dazu zu lernen.
Obgleich ich da nicht so sicher bin, ob ich ein Javascript eingebunden bekäme (und so superwichtig ist mein Problem jetzt ja auch nicht - wäre nur schön gewesen, wenn es dafür eine schnelle Lösung gegeben hätte).

Footer werden in WP übrigens üblicherweise per "Widget" ausgegeben. Ich könnte also ein eigenes Widget für einen Extra Footer erstellen. Das habe ich auch schon hinbekommen. Allerdings werde ich den Ursprungsfooter nicht los (und habe dann also 2 Footer). Außerdem müsste ich den neuen Footer noch per CSS formatieren, was mir auch zu viel Aufwand ist, weshalb ich es jetzt vorerst aufgegeben habe.
 

Aaron3219

Senior HTML'ler
6 Oktober 2015
1.047
204
63
18
@basti1012 mein Plan war es, einfach den href-Link auf der Impressumseite zu replacen, da es ja nur da nicht funktioniert. Meiner Meinung nach wäre das einfacher ;)
 
Werbung: