[J3-4] Barre de lecture progression en Haut ou en bas

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • [Problème] [J3-4] Barre de lecture progression en Haut ou en bas

    Hello j'ai un petit souci je recherche une barre de progression de lecture qui lit uniquement le contenu du texte "contents", la plupart que j'ai trouvé ne lissent que malheureusement tout le contenu c'est à dire du haut de l'ascenseur jusqu'en bas.
    Y'a des progress bar reader des blogs qui fonctionnent très bien et lissent juste le contenu du blog, mais moi je voudrai faire pareil juste avec le content.
    Le code :
    <script>let processScroll = () => {
    let docElem = document.documentElement,
    docBody = document.body,
    scrollTop = docElem['scrollTop'] || docBody['scrollTop'],
    scrollBottom = (docElem['scrollHeight'] || docBody['scrollHeight']) - window.innerHeight,
    scrollPercent = scrollTop / scrollBottom * 100+ '%';
    console.log(scrollTop + ' / ' + scrollBottom + ' / ' + scrollPercent);

    document.getElementById("progress-baro").style.setProperty("--scrollAmount", scrollPercent);
    document.getElementById("progress-baro").innerHTML= Math.round(scrollTop / scrollBottom *100) + "%";

    }

    document.addEventListener('scroll', processScroll);</script>​


    css
    #progress-baro {
    --scrollAmount: 0%;
    width: var(--scrollAmount);
    background-repeat:repeat;
    position: fixed;
    bottom: 0;
    z-index:10000000000000000000000;
    }​
    Si quelques peut m'aider ;-)
    Merci
    Dernière édition par shirine75 à 03/05/2023, 15h42

Annonce

Réduire
Aucune annonce pour le moment.

Partenaire de l'association

Réduire

Hébergeur Web PlanetHoster
Travaille ...
X