[Frage] Einfacher back-to-top-Button mit jQuery funktioniert nicht TYPO3-Version: 7.6.14

  • Schwerus Schwerus
    R2-D2
    0 x
    107 Beiträge
    0 Hilfreiche Beiträge
    11. 01. 2018, 21:27

    Hallo zusammen!

    Ich bekomme es im Moment mit T3 nicht hin, einen simplen back-to-top-Button mit jQuery zu realisiern, der verschwindet, wenn man nach unten scrollt.

    jQuery ist eingebunden und läuft.
    Es zieht das Button-Script auch an, denn im FireBug gibt es Fehler, falls man welche im Script provoziert.
    Und es muss mit page.includeJSFooter.file5 = fileadmin/tmplcss/ButtonUp.js ans Ende geschoben werden, sonst wird es zu früh angezogen.

    Es scheint aber keine Verknüpfung zwischen der Klasse im Script und der CSS Class zu geben:
    Der Button erscheint zwar <a href="#" class="back-to-top">Nach oben</a>, doch er wird weder zu Anfang versteckt noch später ausgeblendet.

    Und zwar unabhängig von den Snippets, die ich bislang ausprobiert habe.

    Ausgangspunkt war das hier, leicht modifiziert. Es funxt auch problemlos, wenn man eine popelige HTML-Datei anlegt und das CSS dazu einbindet - nur halt nicht in TYPO3.

    [code]$(function() {

    // Der Button wird ausgeblendet
    $(".back-to-top").hide();

    // Funktion für das Scroll-Verhalten
    $(function () {
    $(window).scroll(function () {
    if ($(this).scrollTop() > 100) { // Wenn 100 Pixel gescrolled wurde
    $('.back-to-top').fadeIn();
    } else {
    $('.back-to-top').fadeOut();
    }
    });

    $('.back-to-top').click(function () { // Klick auf den Button
    $('body,html').animate({
    scrollTop: 0
    }, 800);
    return false;
    });
    });

    });[/code]

    Bin für jeden Hinweis dankbar...

    Thx in advance

    Schwerus

    Projekt mit der größten Brüller-Dichte: http://www.thedailyschwerus.com - natürlich inkl. eigener Templates für Smartphones

    - Der Vollständigkeit halber: "Certified TYPO3 Integrator"


  • Schwerus Schwerus
    R2-D2
    0 x
    107 Beiträge
    0 Hilfreiche Beiträge
    02. 02. 2018, 13:21

    Irgendwie ist die Lösung, die ich bereits gepostet hatte, verschwunden, deswegen hier nochmal:

    "ein js fehler" von Teisinger trifft es ziemlich genau - nur, dass er nicht vom selbst-Gebauten kam.

    SONDERN VON DER EXTENSION perfectlightbox!
    Sie bringt eigenes jQuery mit - und bindet auch eigene jQ-Frameworks mit ein.

    Extension deaktiviert - und jetzt läuft der einfache Code... doof nur, dass der Kunde natürlich weiterhin seine Lightbox haben will.

    Ich versuche mal eine andere - bin aber natürlich gerne für Tipps offen.

    Projekt mit der größten Brüller-Dichte: http://www.thedailyschwerus.com - natürlich inkl. eigener Templates für Smartphones

    - Der Vollständigkeit halber: "Certified TYPO3 Integrator"

  • Teisinger Teisinger
    Jedi-Ratsmitglied
    0 x
    502 Beiträge
    37 Hilfreiche Beiträge
    02. 02. 2018, 18:57

    ganz einfach global die Einbindung von JS Dateien deaktivieren bzw. löschen. Danach die benötigten JS-Files manuell includen:

    ### Erste Zeile löscht alle Includes von JS-Files auch die der Extensions, sofern du dein TS als letzten laden lässt.
    page.includeJS >
    page.includeJS {
    file1 = path
    .
    .
    .
    etc.
    }

    https://github.com/groundstack-org