permuter z-index avec un click sur image

Pour toutes les discussions sur le code client, HTML et CSS
Répondre
pou
Messages : 2
Enregistré le : 02 oct. 2018, 21:48

permuter z-index avec un click sur image

Message par pou » 02 oct. 2018, 22:04

Bonjour
je ne suis pas jeune j'ai fait il y a des années mon site en html4 et je voulais le renouveler en html5 et CSS3

je viens de poser deux div et je me rends compte que pour permuter celui du dessous avec celui du dessus
il faut utiliser du javascript si j'utilise une image comme déclencheur de l'action

Cela fait un 3° langage à apprendre et mes neurones déclarent forfait!

Qui pourrait me venir en aide?
merci
B

93kf.free.fr

Avatar du membre
webmaster
Administrateur du site
Messages : 563
Enregistré le : 28 févr. 2017, 15:19

Re: permuter z-index avec un click sur image

Message par webmaster » 04 oct. 2018, 12:50

Bonjour

Hé oui, le développement web ne se simplifie pas. Bien au contraire.
Je trouve aussi que c'est assez étrange.
Si on ajoute les frameworks quasi indispensable en entreprise (comme react ou angular), la gestion de projet avec npm et git, cela fait une quantité de connaissances assez enorme

Pour répondre à la question posée, inverser 2 divs avec un clic js a plusieurs solutions
En voici une :


Code : Tout sélectionner

<div id="container"><div id="div1">DIV 1</div><div id="div2">DIV 2</div></div>
Attention, il ne faut pas d'espace entre les <div> !!

<div onclick="invert()">INVERSER</div>
<script>
function invert() {
  var container=document.getElementById("container");
  container.appendChild(container.firstChild);
}
</script>
<style type="text/css">
div {
	padding:6px;
	margin:6px;
	border:1px solid #999;
}
</style>
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

pou
Messages : 2
Enregistré le : 02 oct. 2018, 21:48

Re: permuter z-index avec un click sur image

Message par pou » 04 oct. 2018, 15:22

Merci, je teste dès que je peux

Répondre