Slider Before After pour mes réalisations produits
Unulducode
-
jordane45 Messages postés 30426 Date d'inscription Statut Modérateur Dernière intervention -
jordane45 Messages postés 30426 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour à tous,
Je souhaite faire un effet sur mon site before after avec deux images.
J'ai trouvé un code mais, étant assez nul, je n'arrive pas à y mettre mes images.
Je mets le code ici.
Merci de vos réponses :)
<html lang="en">
<head>
<title>slider-before-after</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="../src/styles/main.css"/>
<link rel="stylesheet" href="../src/styles/custom-range-input.css"/>
<link rel="stylesheet" href="styles/main.css"/>
</head>
<body>
<div class="slider-before-after">
<div class="slider-before-image">
<img src=" " />
</div>
<div class="slider-after-image">
<img src=" " />
</div>
<input type="range" class="slider-track"/>
</div>
<div class="slider-before-after">
<div class="slider-before-image">
<img src=" " />
</div>
<div class="slider-after-image">
<img src=" " />
</div>
<input type="range" class="slider-track"/>
</div>
<script src="../src/scripts/slider-before-after.js"></script>
</body>
</html>
Je souhaite faire un effet sur mon site before after avec deux images.
J'ai trouvé un code mais, étant assez nul, je n'arrive pas à y mettre mes images.
Je mets le code ici.
Merci de vos réponses :)
<html lang="en">
<head>
<title>slider-before-after</title>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="../src/styles/main.css"/>
<link rel="stylesheet" href="../src/styles/custom-range-input.css"/>
<link rel="stylesheet" href="styles/main.css"/>
</head>
<body>
<div class="slider-before-after">
<div class="slider-before-image">
<img src=" " />
</div>
<div class="slider-after-image">
<img src=" " />
</div>
<input type="range" class="slider-track"/>
</div>
<div class="slider-before-after">
<div class="slider-before-image">
<img src=" " />
</div>
<div class="slider-after-image">
<img src=" " />
</div>
<input type="range" class="slider-track"/>
</div>
<script src="../src/scripts/slider-before-after.js"></script>
</body>
</html>
A voir également:
- Slider Before After pour mes réalisations produits
- Cle de produits windows 8.1 - Guide
- Wow slider - Télécharger - Présentation
- Ryanair produits interdits en cabine - Guide
- Msi after - Télécharger - Optimisation
- Clémence souhaite faire calculer automatiquement les prix de 30 produits dans trois devises. elle a déjà saisi une formule de calcul pour le tarif du premier produit dans la première devise. corrigez sa formule afin que recopiée vers le bas puis vers la droite, elle remplisse correctement tout le tableau. - Forum Excel
1 réponse
Bonjour,
Déjà, il faut utiliser les balises de code lorsque tu postes du code sur le forum
(explications à lire entièrement, disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code)
Ensuite, ben.. pour avoir des images... il faut renseigner leur chemin dans les attributs SRC de tes balises img
>> Attention à bien respecter les majuscules/minuscules dans le nom des fichiers/répertoires du chemin que tu indiques.
Si ça ne marche pas après ça .. faudra nous montrer également le code de tes fichiers css et js !
Déjà, il faut utiliser les balises de code lorsque tu postes du code sur le forum
(explications à lire entièrement, disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code)
Ensuite, ben.. pour avoir des images... il faut renseigner leur chemin dans les attributs SRC de tes balises img
<img src="chemin/vers/ton/image.jpeg" />
>> Attention à bien respecter les majuscules/minuscules dans le nom des fichiers/répertoires du chemin que tu indiques.
Si ça ne marche pas après ça .. faudra nous montrer également le code de tes fichiers css et js !
