Hello, how can I set the cursor position to retrieve the number in the wheel segments?
<div class="wheel-container">
<div class="spinBtn">Tourner</div>
<div class="wheel">
<span style="--i:0;"></span>
<span style="--i:1;"></span>
<span style="--i:2;"></span>
<span style="--i:3;"></span>
<span style="--i:4;"></span>
<span style="--i:5;"></span>
<span style="--i:6;"></span>
<span style="--i:7;"></span>
<span style="--i:8;"></span>
<span style="--i:9;"></span>
<span style="--i:10;"></span>
<span style="--i:11;"></span>
<span style="--i:12;"></span>
<span style="--i:13;"></span>
<span style="--i:14;"></span>
<span style="--i:15;"></span>
<span style="--i:16;"></span>
<span style="--i:17;"></span>
<span style="--i:18;"></span>
<span style="--i:19;"></span>
<span style="--i:20;"></span>
<span style="--i:21;"></span>
<span style="--i:22;"></span>
<span style="--i:23;"></span>
<span style="--i:24;"></span>
<span style="--i:25;"></span>
<span style="--i:26;"></span>
<span style="--i:27;"></span>
<span style="--i:28;"></span>
<span style="--i:29;"></span>
<span style="--i:30;"></span>
<span style="--i:31;"></span>
<span style="--i:32;"></span>
<span style="--i:33;"></span>
<span style="--i:34;"></span>
<span style="--i:35;"></span>
<span style="--i:36;"></span>
<span style="--i:37;"></span>
<span style="--i:38;"></span>
<span style="--i:39;"></span>
<span style="--i:40;"></span>
<span style="--i:41;"></span>
<span style="--i:42;"></span>
<span style="--i:43;"></span>
<span style="--i:44;"></span>
<span style="--i:45;"></span>
<span style="--i:46;"></span>
<span style="--i:47;"></span>
<span style="--i:48;"></span>
<span style="--i:49;"></span>
<span style="--i:50;"></span>
<span style="--i:51;"></span>
<span style="--i:52;"></span>
<span style="--i:53;"></span>
<span style="--i:54;"></span>
<span style="--i:55;"></span>
<span style="--i:56;"></span>
<span style="--i:57;"></span>
<span style="--i:58;"></span>
<span style="--i:59;"></span>
<span style="--i:60;"></span>
<span style="--i:61;"></span>
<div class="number">
<b id="0" style="--i:0;">0</b>
<b id="1" style="--i:1;">1</b>
<b id="2" style="--i:2;">2</b>
<b id="3" style="--i:3;">3</b>
<b id="4" style="--i:4;">4</b>
<b id="5" style="--i:5;">5</b>
<b id="6" style="--i:6;">6</b>
<b id="7" style="--i:7;">7</b>
<b id="8" style="--i:8;">8</b>
<b id="9" style="--i:9;">9</b>
<b id="10" style="--i:10;">10</b>
<b id="11" style="--i:11;">11</b>
<b id="12" style="--i:12;">12</b>
<b id="13" style="--i:13;">13</b>
<b id="14" style="--i:14;">14</b>
<b id="15" style="--i:15;">15</b>
<b id="16" style="--i:16;">16</b>
<b id="17" style="--i:17;">17</b>
<b id="18" style="--i:18;">18</b>
<b id="19" style="--i:19;">19</b>
<b id="20" style="--i:20;">20</b>
<b id="21" style="--i:21;">21</b>
<b id="22" style="--i:22;">22</b>
<b id="23" style="--i:23;">23</b>
<b id="24" style="--i:24;">24</b>
<b id="25" style="--i:25;">25</b>
<b id="26" style="--i:26;">26</b>
<b id="27" style="--i:27;">27</b>
<b id="28" style="--i:28;">28</b>
<b id="29" style="--i:29;">29</b>
<b id="30" style="--i:30;">30</b>
<b id="31" style="--i:31;">31</b>
<b id="32" style="--i:32;">32</b>
<b id="33" style="--i:33;">33</b>
<b id="34" style="--i:34;">34</b>
<b id="35" style="--i:35;">35</b>
<b id="36" style="--i:36;">36</b>
<b id="37" style="--i:37;">37</b>
<b id="38" style="--i:38;">38</b>
<b id="39" style="--i:39;">39</b>
<b id="40" style="--i:40;">40</b>
<b id="41" style="--i:41;">41</b>
<b id="42" style="--i:42;">42</b>
<b id="43" style="--i:43;">43</b>
<b id="44" style="--i:44;">44</b>
<b id="45" style="--i:45;">45</b>
<b id="46" style="--i:46;">46</b>
<b id="47" style="--i:47;">47</b>
<b id="48" style="--i:48;">48</b>
<b id="49" style="--i:49;">49</b>
<b id="50" style="--i:50;">50</b>
<b id="51" style="--i:51;">51</b>
<b id="52" style="--i:52;">52</b>
<b id="53" style="--i:53;">53</b>
<b id="54" style="--i:54;">54</b>
<b id="55" style="--i:55;">55</b>
<b id="56" style="--i:56;">56</b>
<b id="57" style="--i:57;">57</b>
<b id="58" style="--i:58;">58</b>
<b id="59" style="--i:59;">59</b>
<b id="60" style="--i:60;">60</b>
<b id="61" style="--i:61;">61</b>
</div>
</div>
</div>
Can you help me do this?
I tried to retrieve the id of the b tags to do it but I can’t do it
I created this code like this to set the number of segments of the wheel with
span
tags and display the numbers in the segments with
b
tags
@justnut:
This is a part of my js code i use for turn this wheel
const spinDuration = 3600; // Durée de la rotation en secondes
let wheel = document.querySelector('.wheel');
let spinBtn = document.querySelector('.spinBtn');
let value = Math.ceil(Math.random() * -3600);
spinBtn.addEventListener("click", function() {
const spanIndex = Math.floor(Math.random() * images.length); // Obtenir un index aléatoire
wheel.style.transform = `rotate(${value}deg)`;
value += Math.ceil(Math.random() * 3600);