Top-Link Button beim Scrollen einbinden

[monaco]

Hallo zusammen,

ist es unter contao 3.4 eigentlich durch eine Erweiterung möglich einen Top-Link Button beim Scrollen einzubinden. Oder muss man da zusätzlich mit JavaScript nachhelfen?

[Stefan01]

Hallo monaco,


eine Erweiterung gibt es meiner Meinung nach nicht; ich habe so einen top-link hier integriert und meinen Bedürfnissen angepasst (das Original ist hier zu finden).
Um JavaSript wirst Du aber vermutlich nicht rumkommen.

Allerdings habe ich zu dem Einsatz der beiden js. Dateien an die Community auch noch eine Frage.
Die beiden Dateien habe ich normal über das Seitenlayout eingebunden.

screenshot.png

Allerdings scheint beim Aufruf der js-Dateien irgendwas nicht richtig zu funktionieren (möglich, dass ich die Dateien falsch eingebunden habe).


Viele Grüße

Stefan

[folkfreund]

@Stefan01: Was scheint denn nicht zu funktionieren?

Ich vermute, dass du unter "Eigerner Javascript Code" auf JQuery verzichten kannst, denn das hast du ja weiter oben schon aktiviert.

folkfreund

[Stefan01]

Hallo folkfreund,


Danke erstmal für die schnelle Antwort, das Verhalten des Toplinks weist doch deutlich vom
Original ab. Wenn ich nach unten scrolle verschwindet mein top-link einfach, beim Anklicken
findet keine Aktion statt.

Ich hatte beide Script-Dateien anfangs im Ordner /assets/js/ liegen, da hat alles einige Stunden funktioniert, bis die
Dateien überschrieben worden sind, was mich dazu veranlasst hat die Dateien in einen extra Ordner zu packen und direkt unter /assets
abzulegen (bin da noch ein ziemlicher Laie).


Viele Grüße

Stefan

[Bennie]

Warum packst Du das js file nicht in den Ordner "files" und dort dann in ein frei gewähltes Unterverzeichnis?
Dafür ist das ja da und updatesicher.
Dort sind doch auch Deine Bilder und css Dateien , nehm ich mal an.
jquery musst Du nicht nochmal einbinden wie schon geschrieben wurde.
Ansonsten zum Einbinden von JS ist das hier auch interessant.

[Stefan01]

Danke für den Tipp, die Dateien hatte ich schon unter files abgelegt. Bin aber selber auf den Fehler gekommen; das main.js wurde aus versehen überschrieben.
Da standen die ursprünglichen Werte drin, deswegen war der top-link beim Scrollen auch nicht sichtbar weil in der Demo Version viel mehr Seiteninhalt vorliegt.

Trotzdem vielen Dank für Eure Hilfe.


Viele Grüße

Stefan

[Schnippel]

Hallo,
ich habe einen in Contao 4.5.6 einen Top-Link nach dieser Vorlage eingabaut :

https://www.agenturzentral.de/blog/c...llen-einbinden

Im Entwicklertool http://vorlage1.ips21.de/app_dev.php funktioniert das Ganze auch,
aber unter der richtigen Domain nicht:
http://vorlage1.ips21.de


Woran kann das liegen?

[folkfreund]

Was genau funktioniert nicht? Bei mir scheint es zu funktionieren (Linux, Chrome).
Hast du bei dir den Browsercache und im Backend den Seiten- und Scriptcache gelöscht?

[Schnippel]

Was genau funktioniert nicht?

Das hier der TopLink immer zu sehen ist. Er soll erst erscheinen, wenn man etwas gescrollt hat.
Unbenannt-1.jpg

Ich habe folgedes schon probiert:

-Systemwartung > Daten bereinigen
- Profil > Cache leere (alle 3)
- Browserchache geleert

Das Problem besteht weiterhin bei der normalen Domain.
Bei der Domain mit /app_dev.php funktioniert es aber so wie es soll.

Was mach ich falsch?

[derRenner]

Hallo,

du bekommst eine Error-Meldung für Zeile 31

$(document).ready(function(){

» mach daraus

(function($) {
	$(document).ready(function(){

... schliessende Klammern am Ende nicht vergessen

[Schnippel]

Danke für den Hinweis.

Es lag aber nicht an den JS-Code für den TOP-Link, sondern an einer anderen Datei, die für den Header-Scroll-Effekt zuständig ist.
Hab da in dieser Header-Scroll-Datei die

(function($) {
	$(document).ready(function(){

und schließende Klammer hinzugefügt, aber es funktionierte immer noch nicht. Dazu kam, daß der Scroll-Effekt für den Header nicht mehr ging.

Habe dann den obigen Code wieder entfernt, und dann in der selben Datei (die für den Header-Scroll-Effekt) das "(jQuery)" noch entfernt und nun passt es.
Kann da jemand nochmal schnell drüber schauen, ob das so ok ist?
(Bin da nicht ganz so fit in diesem Thema :-( )

[Andreas]

...
möglich, dass ich die Dateien falsch eingebunden habe

Die Schriftarten solltest du oben im entsprechenden Feld "Google-Webfonts" eintragen.

Für die JS-Dateien solltest du dir ein j_Template erstellen. Damit hast du dann auch sehr schön die Möglichkeit zu entscheiden, wo die Dateien geladen werden sollen (HEAD, HEAD im Combiner oder vor </body>).

Eigene Dateien gehören nicht in den Core (wurde bereits erwähnt). Stattdessen z.b. files/css/ files/js/.

Als jQuery-Quelle solltest du "lokal" auswählen, dies ist schneller, zuverlässiger und spart eine Serveranfrage.

Und auch bereits gesagt: jQuery nicht zweimal einbinden.

Bei eigenen Scripten muss man darauf achten, ob das Laden nach dom ready oder page load (oder keins von beiden) erforderlich ist. Und wenn gleichzeitig ein anderes Framework (z.B. MooTools) benutzt wird müssen die Scripte richtig gekapselt werden (kann man alles abgucken bei den Templates aus dem Core - j_xxx, moo_xxx).