• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[GELOEST] Bilder Skalieren

CoFi_de

Neues Mitglied
Ich habe eine Website auf der man Bilder herunterladen kann. Diese sind allerdings alle 5760x4321 und haben eine Dateigröße von durchschnittlich 15mb. Jetzt sind ca. schon über 120 Bilder auf der Website. Allerdings baucht diese jetzt bei langsamen Verbindungen sehr lange zum laden. Jetzt möchte ich die Vorschau skalieren. Allerdings muss es so sein, dass die Bildqualität dadurch gesenkt wird. Habt ihr eine Idee, wie man das umsetzen kann?

HTML:
<div class="col-lg-4 col-md-6 portfolio-item filter-web">
            <div class="portfolio-wrap">
              <img src="assets/img/portfolio/002.jpg" class="img-fluid" alt="">
              <div class="portfolio-info">
                <div class="portfolio-links">
                  <a href="assets/img/portfolio/portfolio-2.jpg" data-gallery="portfolioGallery" class="portfolio-lightbox" title="Web 3"><i class="bx bx-plus"></i></a>
                  <a href="portfolio-details.html" title="Download"><i class="bx bx-download"></i></a>
                </div>
              </div>
            </div>
          </div>
 
Werbung:
Damit kann man jetzt nicht viel anfangen.
Hast du für die Bilder jetzt Thumbnail Bilder erstellt, oder wolltest du die vom Originalbild benutzen?

Die Bilder mit CSS zu verkleinern, bringt aber nichts, da die Originalgröße der Bilder trotzdem bleibt.
Erstelle dir ein PHP Script was dir die Originalbilder kleiner macht, und sobald einer darauf klickt, zeigst du ihn das große an.

Es gibt auch lazyload.js, was die Bilder erst lädt, wenn sie im Browser sichtbar sind.
Ob das, das richtige für dich ist, musst du selber wissen.
 
Werbung:
Zurück
Oben