Ciao a tutti, mi stò cimentando le prime volte con JQuery. Volevo creare una gallery stile google caricando le foto man mano la pagina viene scrollata.
Inb sostanza con JQuery interrogo una servlet Java che genera i <li></li> contenenti le foto. Dopodiché le scrivo dinamicamente con JQuery.
Funziona tutto, quando scrollo la pagina JQuery interroga la Servlet e ottiene i nuovi elementi ed in effetti vedo le nuove foto comparire man mano.
Unico problema se clicco sulle foto inserite fisicamente nel codice HTML tutto funziona e si apre la descrizione, se invece clicco sulle foto generate da JQuery e aggiunte con append() non mi apre la descrizione.
Qualche consiglio o suggerimento?
Lo script per la Grid Gallery è questo: https://tympanus.net/codrops/2013/03...nding-preview/
Vi allego anche parte del codice:
Questa parte ottiene i tag <li> con il relativo contenuto dalla Servlet e lo inserisce con JQuery nel tag <ul>
codice:<script type="text/javascript"> window.onscroll = function() { $.get("infinitContentServlet", function(data){ $("#og-grid").append(data); $contentLoadTriggered = false; }); } </script>
Quà invece troviamo la parte relativa alla gallery, ho lasciato un unico elemento dato che gli altri vengono generati con JQuery, in sostanza se si clicca su questo elemento ovvero il primo si apre la descrizione, se si clicca su quelli successivi generati da JQuery non si apre.
codice HTML:<div class="main"> <ul id="og-grid" class="og-grid"> <li><a href="" data-largesrc="images/1.jpg" data-title="Primo" data-description="Descrizione di prova"> <img src="images/thumbs/1.jpg" alt="img01"/> </a></li></ul>