Bonjour,
Voila j'aimerai optimiser mon code.

Ce que je fais

J'ai ecrit le code suivant pour appliquer une class à un élément, lorsqu'on scroll à 400px avant ce dernier.
Cela fonctionne parfaitement.

$(window).scroll(function() {

    var wS = $(this).scrollTop();

    $('.cache').each(function(){
        var hT = $(this).offset().top;
        if (wS > (hT - 400)){
            $(this).addClass('cacheOn');
        }
        else{
            $(this).removeClass('cacheOn');     
        }
    })
}); 

Ce que je veux

Je voudrais desormais l'appliquer à plusieurs éléments distinct, mais surtout avec des valeurs différentes.
Je me dis donc qu'il faut definir la function en amont, avec un argument. Puis faire appel à elle en l'appliquant sur un élément précis, avec une valeur d'argument spécifique.

Mais c'est là ou je bloque complétement....
Une idée... ?

Merci d'avance

4 réponses


Ekim Kael
Réponse acceptée

salut je pense pour ma part que c'est assez facile à faire en fait vue ton code marche déjà.
tu as besoin de deux choses:

  • l'element sur lequel tu veux appliquer le comportement(class ou id) = element
  • la hauteur à laquelle le scroll doit être surveiller = scrollHeight
  • definir une fonction et lui donner un nom et lui passer l'element et la hauteur du scroll en paramètre = function scrolling (element,scrollHeight) { }
    Voila déjà un bon debut de piste à toi de faire le reste ;)

hello,
je capte po trop ton pb, si tu veux appliquer ta routine à différents éléments tu fais ça :

$('.cache, .foo, .mop, .unautretruc').each(function(){

après je te conseille ce tuto, c super pratique ;)

Merci pour les conseils,
je vais m'y pencher de facon plus constructive.

Cool.n'oublie pas mettre le post en [RESOLU] si la solution marche histoire de nous aider à faire le tri et a aidé d'autres