|
1 | 1 | let count = 0; |
2 | 2 |
|
3 | | -const counterDisplay = document.getElementById('counter'); |
4 | | -const decreaseBtn = document.getElementById('decrease'); |
5 | | -const resetBtn = document.getElementById('reset'); |
6 | | -const increaseBtn = document.getElementById('increase'); |
| 3 | +const counterDisplay = document.getElementById("counter"); |
| 4 | +const decreaseBtn = document.getElementById("decrease"); |
| 5 | +const resetBtn = document.getElementById("reset"); |
| 6 | +const increaseBtn = document.getElementById("increase"); |
7 | 7 |
|
8 | 8 | function updateDisplay() { |
9 | | - counterDisplay.textContent = count; |
10 | | - |
11 | | - // Cambiar color según el valor |
12 | | - if (count > 0) { |
13 | | - counterDisplay.style.color = '#2ecc71'; |
14 | | - } else if (count < 0) { |
15 | | - counterDisplay.style.color = '#e74c3c'; |
16 | | - } else { |
17 | | - counterDisplay.style.color = '#2c3e50'; |
18 | | - } |
| 9 | + counterDisplay.textContent = count; |
19 | 10 |
|
20 | | - // Pequeño efecto de escala al cambiar |
21 | | - counterDisplay.style.transform = 'scale(1.2)'; |
22 | | - setTimeout(() => { |
23 | | - counterDisplay.style.transform = 'scale(1)'; |
24 | | - }, 100); |
| 11 | + // Cambiar color según el valor |
| 12 | + if (count > 0) { |
| 13 | + counterDisplay.style.color = "#2ecc71"; |
| 14 | + } else if (count < 0) { |
| 15 | + counterDisplay.style.color = "#e74c3c"; |
| 16 | + } else { |
| 17 | + counterDisplay.style.color = "#2c3e50"; |
| 18 | + } |
| 19 | + |
| 20 | + // Pequeño efecto de escala al cambiar |
| 21 | + counterDisplay.style.transform = "scale(1.2)"; |
| 22 | + setTimeout(() => { |
| 23 | + counterDisplay.style.transform = "scale(1)"; |
| 24 | + }, 100); |
25 | 25 | } |
26 | 26 |
|
27 | | -decreaseBtn.addEventListener('click', () => { |
28 | | - count--; |
29 | | - updateDisplay(); |
| 27 | +decreaseBtn.addEventListener("click", () => { |
| 28 | + count--; |
| 29 | + updateDisplay(); |
30 | 30 | }); |
31 | 31 |
|
32 | | -increaseBtn.addEventListener('click', () => { |
33 | | - count++; |
34 | | - updateDisplay(); |
| 32 | +increaseBtn.addEventListener("click", () => { |
| 33 | + count++; |
| 34 | + updateDisplay(); |
35 | 35 | }); |
36 | 36 |
|
37 | | -resetBtn.addEventListener('click', () => { |
38 | | - count = 0; |
39 | | - updateDisplay(); |
| 37 | +resetBtn.addEventListener("click", () => { |
| 38 | + count = 0; |
| 39 | + updateDisplay(); |
40 | 40 | }); |
41 | 41 | // Release trigger |
0 commit comments