0
votes

Sélecteurs JQuery pour obtenir la couleur de fond

J'ai actuellement plusieurs divisions avec un SVG dans chacun. Je veux obtenir la couleur d'arrière-plan de la prochaine Div (ciblée par la classe) à travers JQuery et l'appliquer comme CSS remplir pour les parents précédents SVG. J'ai essayé d'utiliser Nextall et Prevall et mais cela ne fonctionne pas.

Afficher l'exemple

jquery

2 commentaires

Qu'est-ce que tu as essayé jusque-là? S'il vous plaît coller du code :) HTML et JQuery vous avez utilisé de préférence.

Heres ce que j'ai jusqu'à présent

3 Réponses :

0
votes

La méthode suivante () renvoie tous les prochains éléments de frère de sœurs de l'élément sélectionné.

Les éléments du soeur sont des éléments qui partagent le même parent.

Je pense que votre div n'est pas le même parent Essayez ceci:

$ (". cible_class"). Parent (). Parent (). Trouver ("Div")

0 commentaires

0
votes

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="awesome" style="background-color:white;">
  <svg id="curveUpColor" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>

<div class="awesome" style="background-color:blue;">
  <svg id="curveUpColor" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>

<div class="awesome" style="background-color:black;">
  <svg id="curveUpColorr" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>

<div class="awesome" style="background-color:red;">
  <svg id="curveUpColorrrr" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>

0 commentaires

0
votes

Essayez ci-dessous code

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="awesome" style="background-color:white;">
<svg id="curveUpColor" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>
<div class="awesome" style="background-color:blue;">
<svg id="curveUpColor" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>
<div class="awesome" style="background-color:black;">
<svg id="curveUpColorr" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>
<div class="awesome" style="background-color:red;">
<svg id="curveUpColorrrr" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%" height="100" viewBox="0 0 100 100" preserveAspectRatio="none">
				<path d="M0 100 C 20 0 50 0 100 100 Z"></path>
			</svg>
</div>

0 commentaires