De La Fenêtre De Défilement Ne Fonctionne Pas

J'ai été faire un blog, et essayé d'utiliser $(window).scroll(function(), mais quelque chose l'empêche de fonctionner.

J'essaie d'ajouter une classe nommée scrolled à corps lorsque l'utilisateur fait défiler vers le bas. Toute idée qui pourrait l'empêcher de travailler correctement? La Console ne donne pas d'erreur en ce qui concerne cela.

JS

$(document).ready(function($) {
    $(window).scroll(function() {    
        var scroll = $(window).scrollTop();

        if (scroll >= 100) {
            $("body").addClass("scrolled");
        } else {
            $("body").removeClass("scrolled");
        }
    });
});

APERÇU EN DIRECT

http://personaii-demo.tumblr.com/

  • Supprimer $ de la fonction. Si vous voulez protéger la fonction puis écrire (function($) { ... })(jQuery);
  • Merci, mais il ne fonctionne pas pour moi.
InformationsquelleAutor Aleksi Tappura | 2014-07-25
  1. 2

    Supprimer overflow:auto propriété ajouté au conteneur. Ce sera le travail.

    InformationsquelleAutor Kapilrc
  2. 0

    Votre fonction prend un $ argument, mais vous n'êtes pas passer quelque chose en tant qu'elle est écrasée, vous devez faire comme ceci:

    $(document).ready(function() {
    $(window).scroll(function() {    
        var scroll = $(window).scrollTop();

        if (scroll >= 100) {
            $("body").addClass("scrolled");
        } else {
            $("body").removeClass("scrolled");
        }
    });
});
    • Ne semble pas fonctionner. J'utilise un wrapper appelé #sb-site, qui pourrait être le problème? J'ai essayé .faites défiler et cela a fonctionné, mais je n'ai pas besoin d'un comportement comme ça.
    InformationsquelleAutor Ben
  3. 0

    Voici un travail d'abréviation solution, violon

    $(function() {
  $(window).scroll(function() {    
    var scroll = ($(this).scrollTop() > 100) ? $("body").addClass("scrolled") : $("body").removeClass("scrolled");
  });
});

    Aussi, si vous êtes à l'aide de jQueryUI ensuite, vous pouvez ajouter un peu d'animation à la classe des processus de changement avec switchClass() par exemple

    var scroll = ($(this).scrollTop() >= 100) ? $("body").switchClass("default","scrolled", 1000) : $("body").switchClass("scrolled","default", 1000);

    *Remarque: Aussi n'oubliez pas d'inclure jQuery/jQueryUI bibliothèques dans votre document.

    • Ne semble pas fonctionner. J'utilise un wrapper appelé #sb-site, qui pourrait être le problème? J'ai essayé .faites défiler et cela a fonctionné, mais je n'ai pas besoin d'un comportement comme ça.
    InformationsquelleAutor mdesdev
  4. 0

    Mieux JS: 

    $(function() {
    $(window).on('scroll', function() {  
        $('body').toggleClass('scrolled', $(this).scrollTop() >= 100);
    });
});

    Sur votre site, je ne vois pas de fichier css associé à .scrolled n'importe où, même si je l'applique via la console.

    • C'est tellement court que je l'aime 🙂
    • Hé, pourquoi vous fermez le document de prêt avec des parenthèses vides })(); ?
    • Ne semble pas fonctionner avec moi, mais il semble assez de travail. J'ai mis $(function() { $(window).sur('défilement', function() { $('#sb-site").toggleClass('défilement', $(this).scrollTop() >= 100); }); })(); sur mon JS, mais toujours pas de travail. Que #sb-site est un wrapper qui gère la couleur d'arrière-plan.
    • faute de frappe, mon mauvais. Aleksi, essayez-le maintenant.
    InformationsquelleAutor AlienWebguy