Hallo,
Wir haben ein JavaScript gemacht um Bildnummern zu generieren leider funktioniert da etwas nicht die Bilder werden nicht Aktualisiert.

Kann mir jemand helfen?
Besten Dank

document.addEventListener('DOMContentLoaded', () => {
  const apertureSlider = document.getElementById('aperture-slider');
  const focalLengthSlider = document.getElementById('focal-length-slider');
  const distanceSlider = document.getElementById('distance-slider');
  const mainImage = document.getElementById('main-image');
  const apertureValueSpan = document.getElementById('aperture-value');
  const focalLengthValueSpan = document.getElementById('focal-length-value');
  const distanceValueSpan = document.getElementById('distance-value');
  const updateImage = () => {
    const aperture = parseFloat(apertureSlider.value);
    const focalLength = parseFloat(focalLengthSlider.value);
    const distance = parseFloat(distanceSlider.value);
    // Aktualisiere die angezeigten Werte
    apertureValueSpan.textContent = `f/${aperture.toFixed(1)}`;
    focalLengthValueSpan.textContent = `${focalLength} mm`;
    distanceValueSpan.textContent = `${distance.toFixed(1)} m`;
    // Passe den Dateinamen an die aktuellen Werte an
    // Beispiel: f1_8_24mm_1_0m.jpg
    const apertureFileName = getClosestValue(aperture, [2, 3, 4, 3, 8, 11, 16, 22]);
    const focalLengthFileName = getClosestValue(focalLength, [24, 35, 50, 85, 135, 200]);
    const distanceFileName = getClosestValue(distance, [1, 2, 3, 5, 7, 10]);
    const imageSrc = `images/f${apertureFileName}_${focalLengthFileName}mm_${distanceFileName}m.jpg`;
     
    mainImage.src = imageSrc;
  };
  const getClosestValue = (value, array) => {
    return array.reduce((prev, curr) => (Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev));
  };
  // Füge Event-Listener für alle Slider hinzu
  apertureSlider.addEventListener('input', updateImage);
  focalLengthSlider.addEventListener('input', updateImage);
  distanceSlider.addEventListener('input', updateImage);
  // Initialen Zustand beim Laden der Seite setzen
  updateImage();
});