Mise en place du code variable Step slide + pb affichage
JE6478
Messages postés11Date d'inscriptionvendredi 14 janvier 2022StatutMembreDernière intervention23 novembre 2024
-
23 nov. 2024 à 16:56
Bonjour à tous je suis bloqué avec mon step variable sur un slide range on m a donné une piste mais impossible de mettre le code reçu en place si quelqu'un peut m aider.
function getMontant(inputValue) {
// les seuils de changement de step
const SEUIL_1 = 5;
const SEUIL_2 = 23;
const SEUIL_3 = 100; // juste pour le test mais pas obligatoire ici
let montant = 0;
for (let i = 0; i < inputValue; i += 1) {
if (i < SEUIL_1) {
montant += 10000;
}
else if (i < SEUIL_2) {
montant += 25000;
}
else if (i < SEUIL_3) {
montant += 50000;
}
}
return montant;
}
et un code pour avoir l espace sur les montants 10 000 au lieu de 10000
/**
* @param {number} en entrée : 15000
* @returns {string} en sortie : 15 000 €
*/
function formatMontant(valeur) {
return new Intl.NumberFormat('fr-FR', {
style: 'currency',
currency: 'EUR',
minimumFractionDigits: 0
}).format(valeur);
ma premiere mise en page fonctionne tres bien pour une page secondaire sans les mofidications que je n arrive pas a ajouter
mais par contre pour la page d accueil je souhaite avoir un slide avec un curseur plus grand avec une info bulle. je ne comprends pas car sur jsbin tout s affiche normalement mais sur le site c est la cata une piste ? et biensur je souhaite rajouter les codes mentionné plus haut pour avoir l ensemble des fonctionnalité pour ce slide
vu avec JSBIN tout va bien l info bulle est présente
une fois en ligne
voici le code du dernier slide
<div class="range-wrap">
<div class="range-value" id="rangeV"></div>
<input id="range" type="range" min="10000" max="1000000" value="20000" step="10000" >
</div>
<p style="text-align: center;"><strong><span style="font-size: 18pt;">Vous gagnerez </span><span id="result" style="font-size: 18pt;">1600</span><span style="font-size: 18pt;">€ * en plus pour vos autres projets</span></strong></p>
<script>
document.querySelector('#range').addEventListener('input',function(){
document.querySelector('#result').textContent =this.value*0.08
})
</script>