kostenloser Webspace werbefrei: lima-city

JS Bilder nachladen wenn sichtbar

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   thwbm

   thwbm hat kostenlosen Webspace.

   18:06, 6.2.2013

   Hallo,
   ich habe mich etwas durch Google gekämpft, habe aber nichts brauchbares gefunden. Ich suche nach einer Möglichkeit, um Bilder der Klasse

   class="Bilder"

   erst nachzuladen, wenn sie im sichtbraren Bereich sind. Hintergrund des Ganzen ist, dass ich sehr viele Bilder habe, die sich in einem Div befinden, der die CSS Eigenschaft

   overflow:scroll;

   hat. Die Seite braucht so, wie sie jetzt ist etwa 20 Sekunden zum Laden, was deutlich zu lange ist. Man sieht ungefähr ein Zentel der Bilder, also würde es reichen, wenn dieses Zehntel geladen werden würde. Mein Lösungsansatz (mit jQuery):
   

   function BlderSichtbar() {
     $(document).ready(function() {
       $("#BilderScrollbar").scroll(function() { //Wenn der Div mit den Bildern gescrollt wird:
         if($(".Bilder") == "Sichtbar") { //Hier weis ich nicht, wie die Afrage aussehen muss.
           //Hier sollen jetzt die Bilder nachgeladen werden, die sichtbar sind.
       });
     });
   }

   
   Optimal wäre es, wenn die Bilder nicht verlohren gehen würden, wenn man scrollt. Also wenn nur 5 weitere Bilder sichtbar werden, reicht es, diese 5 nachzuladen, alle schon geladenen Bilder müssen nicht nachgeladen werden. Hat Irgendjemand Lösungsvorschläge, Denkansätze oder Ähnliches?
   MFG THWBM

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. steelman

   steelman hat kostenlosen Webspace.

   20:53, 6.2.2013

   Wie wäre es mit dem LazyLoad Plugin für JQuery?
   Hier der Link:
   http://www.appelsiini.net/projects/lazyload
   
   MfG Max

4. xian

   xian hat kostenlosen Webspace.

   21:29, 6.2.2013

   viele seiten laden nach dem runterscrollen hektisch nach und man wartet sekundenlang auf das neue.
   aus user-sicht wäre eine besser ausbalancierte lösung wünschenswert: preload etwa eine halbe seite über den sichtbaren bereich hinaus, der rest lazy. so wäre einem die immer noch faule anzeige stets voraus.
5. Autor dieses Themas

   thwbm

   thwbm hat kostenlosen Webspace.

   14:21, 7.2.2013

   Hallo,
   

   steelman schrieb:
   Wie wäre es mit dem LazyLoad Plugin für JQuery?
   

   
   ich habe es mir gerade mal durchgelesen, es sieht vielversprechend aus, aber bevor ich es mir näher anschaue, möchte ich wissen, wie die Lizensierung ist. Ist es auch für Kommerzielle zwecke erlaubt, oder nicht? Ich möchte mir damit nicht die Möglichkeit nehmen, Werbung auf der Internetseite einzublenden. Ich habe zu dem Thema kommerzielle Nutzung nichts gefunden, hat jemand einen Link?
   

   xian schrieb:
   viele seiten laden nach dem runterscrollen hektisch nach und man wartet sekundenlang auf das neue.
   aus user-sicht wäre eine besser ausbalancierte lösung wünschenswert: preload etwa eine halbe seite über den sichtbaren bereich hinaus, der rest lazy. so wäre einem die immer noch faule anzeige stets voraus.

   
   Das werde ich warscheinlich machen, sofern Lazy-Load auch kommerziell nutzbar ist. Dazu gibt es auch eine Lazy-Load Lösung. Sieh Unterpunkt "Setting Sensitivity".
   MFG THWBM
   EDIT:
   Ich habe gerade den Hinweis gefunden, dass Lazy-Load unter der MIT Lizens angeboten wird, deren Deutsche Übersetzung ist laut Wikipedia, und die Übersetzung kommt mir richtig vor:
   

   
   Copyright (c) <Jahr> <Copyrightinhaber>
   
   Hiermit wird unentgeltlich, jeder Person, die eine Kopie der Software und der zugehörigen Dokumentationen (die "Software") erhält, die Erlaubnis erteilt, sie uneingeschränkt zu benutzen, inklusive und ohne Ausnahme, dem Recht, sie zu verwenden, kopieren, ändern, fusionieren, verlegen, verbreiten, unterlizenzieren und/oder zu verkaufen, und Personen, die diese Software erhalten, diese Rechte zu geben, unter den folgenden Bedingungen:
   
   Der obige Urheberrechtsvermerk und dieser Erlaubnisvermerk sind in allen Kopien oder Teilkopien der Software beizulegen.
   
   DIE SOFTWARE WIRD OHNE JEDE AUSDRÜCKLICHE ODER IMPLIZIERTE GARANTIE BEREITGESTELLT, EINSCHLIESSLICH DER GARANTIE ZUR BENUTZUNG FÜR DEN VORGESEHENEN ODER EINEM BESTIMMTEN ZWECK SOWIE JEGLICHER RECHTSVERLETZUNG, JEDOCH NICHT DARAUF BESCHRÄNKT. IN KEINEM FALL SIND DIE AUTOREN ODER COPYRIGHTINHABER FÜR JEGLICHEN SCHADEN ODER SONSTIGE ANSPRÜCHE HAFTBAR ZU MACHEN, OB INFOLGE DER ERFÜLLUNG EINES VERTRAGES, EINES DELIKTES ODER ANDERS IM ZUSAMMENHANG MIT DER SOFTWARE ODER SONSTIGER VERWENDUNG DER SOFTWARE ENTSTANDEN.
   

   
   Aber was heißt das jetzt?
   

   
   "Hiermit wird unentgeltlich, jeder Person, die eine Kopie der Software und der zugehörigen Dokumentationen (die "Software") erhält, die Erlaubnis erteilt, sie uneingeschränkt zu benutzen, inklusive und ohne Ausnahme, dem Recht, sie zu verwenden, kopieren, ändern, fusionieren, verlegen, verbreiten, unterlizenzieren und/oder zu verkaufen, und Personen, die diese Software erhalten, diese Rechte zu geben, unter den folgenden Bedingungen:"
   

   
   Hört sich für mich danach an, dass ich den Quelltext verkaufen dürft, also einer dritten Person gegen Geld anbieten dürfte, aber das wäre ja Sinnlos, denn Lazy-Load wird ja kostenlos zum Download angeboten.
   
   Beitrag zuletzt geändert: 8.2.2013 21:04:48 von thwbm

6. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?