CONNEXION
  • RetourJeux
    • Sorties
    • Hit Parade
    • Les + populaires
    • Les + attendus
    • Soluces
    • Tous les Jeux
    • Gaming
  • RetourActu Gaming
    • News
    • Astuces
    • Tests
    • Previews
    • Toute l'actu gaming
  • RetourBons plans
    • Bons plans
    • Bons plans Smartphone
    • Bons plans Hardware
    • Bons plans Image et Son
    • Bons plans Amazon
    • Bons plans Cdiscount
    • Bons plans Decathlon
    • Bons plans Fnac
    • Tous les Bons plans
  • RetourJVTech
    • Actus High-Tech
    • Intelligence Artificielle
    • Smartphones
    • Mobilité urbaine
    • Hardware
    • Image et son
    • Tutoriels
    • Tests produits High-Tech
    • Guides d'achat High-Tech
    • JVTech
  • RetourCulture
    • Actus Culture
    • Culture
  • RetourVidéos
    • A la une
    • Gaming Live
    • Vidéos Tests
    • Vidéos Previews
    • Gameplay
    • Trailers
    • Chroniques
    • Replay Web TV
    • Toutes les vidéos
  • RetourForums
    • Hardware PC
    • PS5
    • Switch 2
    • Xbox Series
    • Switch
    • Pokemon pocket
    • FC 25 Ultimate Team
    • League of Legends
    • Tous les Forums
  • PC
  • PS5
  • Xbox Series
  • Switch 2
  • PS4
  • One
  • Switch
  • iOS
  • Android
  • MMO
  • RPG
  • FPS
En ce moment Genshin Impact Valhalla Breath of the wild Animal Crossing GTA 5 Red dead 2
Liste des sujets

[html] Échanger des images...

Obvious-Sir
Obvious-Sir
Niveau 10
22 février 2016 à 20:28:45

J'aimerais créer un bouton pour afficher une image, puis un autre pour l'enlever. Cela est il possible ?

MrGreez94
MrGreez94
Niveau 10
22 février 2016 à 20:46:42

Tu aimerais rendre l'image invisible ou carrément virer l'image de la page ?

Je pense que tu auras ta réponse ici en CSS
:d) http://www.w3schools.com/css/css_display_visibility.asp

Obvious-Sir
Obvious-Sir
Niveau 10
22 février 2016 à 20:48:35

Ce que je voudrais faire c'est avoir un bouton qui fait :

Affiche l'image
Met une légende en dessous

Et un autre bouton qui fait :

Enlève le texte
rend l'image invisible

MrGreez94
MrGreez94
Niveau 10
22 février 2016 à 20:52:51

Tu peux donc mettre ton image et ton texte sans le bouton et créer un bouton qui va rendre le tout visible s'il ne l'est pas et inversemen :ok:

Obvious-Sir
Obvious-Sir
Niveau 10
22 février 2016 à 20:53:27

Je n'ai jamais rien compris aux boutons en html :snif:

MrGreez94
MrGreez94
Niveau 10
22 février 2016 à 21:12:52

Je pense pas que ce soit possible de faire ce genre de bouton uniquement en HTML, tu vas devoir ajouter un peu de JS à ta page

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<figure id ="my_image" style = "visibility :visible">
 			<img src="00.jpg" alt="Mon image">
  			<figcaption>Mon image qu'elle est trop bien</figcaption>
		</figure>

		<button onclick ="clic();">Click Me!</button>

		<script type="text/javascript"> 
		   function clic(){ 
				my_image = document.getElementById("my_image");
				if(my_image.style.visibility == "visible") { 
					my_image.style.visibility = "hidden";
				} else {
					my_image.style.visibility = "visible";
				}
		   } 
		</script> 

    </body>
</html>
Obvious-Sir
Obvious-Sir
Niveau 10
23 février 2016 à 07:02:22

je peux repeter le script pour plusieurs images ?

moxo75
moxo75
Niveau 6
23 février 2016 à 09:37:12

Pour utiliser le script sur plusieur images il te suffit de modifier le script comme suit:

function clic(id){ my_image = document.getElementById(id); if(my_image.style.visibility == "visible") { my_image.style.visibility = "hidden"; } else { my_image.style.visibility = "visible"; } }

et d'appeler click('ID_DE_L_IMAGE');

sans oublier d'utiliser des id différents pour chaques images

Sous forums
  • Aide à l'achat Mac
  • Steam Deck
  • Création de sites web
  • Création de Jeux
  • Linux
  • Programmation
  • Internet
  • Macintosh
  • Hardware
La vidéo du moment