Databases
StackOverflow2013
Postsdbo
POjQuery galleria plugin with dynamically loaded images
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery galleria plugin with dynamically loaded images
    text
    copied!<p>I'm using the Galleria plugin with jQuery to create my image gallery. I'm trying to get load images dynamically from the user's selection into the DOM and have the gallery auto-update to display those new images but it's not working.</p> <p>Firebug shows the images are successfully loading into the DOM but Galleria displays no thumbnails. I need a way to reload Galleria to display the new images.</p> <pre><code>/* ---- Gallery Code ---- */ if ($(this).find('div').attr('title') == 'photogallery' &amp;&amp; $('.galleria_container').length == 0) { $('.gallery').galleria( { history : false, clickNext : true, onImage : function(image,caption,thumb) { if(! ($.browser.mozilla &amp;&amp; navigator.appVersion.indexOf("Win")!=-1) ) { image.css('display','none').fadeIn(1000); } var _li = thumb.parents('li'); caption.css('display','none').fadeIn(1000); _li.siblings().children('img.selected').fadeTo(500,0.3); thumb.fadeTo('fast',1).addClass('selected'); image.attr('title','Next image &gt;&gt;'); }, onThumb : function(thumb) { var _li = thumb.parents('li'); var _fadeTo = _li.is('.active') ? '1' : '0.3'; thumb.css({display:'none',opacity:_fadeTo}).fadeIn(1500); thumb.hover ( function() { thumb.fadeTo('fast',1); }, function() { _li.not('.active').children('img').fadeTo('fast',0.3); } // don't fade out if the parent is active ) } }); } /* ---- Gallery Selector ---- */ $(document).ready(function() { var galleryImages = new Object(); &lt;?php echo $myGal; ?&gt; function setImages(type) { var image = ''; for (var i = 0; i &lt; galleryImages[type].length; i++) { image += '&lt;li&gt;&lt;img src="' + galleryImages[type][i] + '"&gt;&lt;/li&gt;'; } $('ul.gallery').html(image); } $('ul.menu-horiz li ul li').click(function() { setImages($(this).attr('rel')); }); }); </code></pre> <p>The PHP code you see just creates an array of images.</p> <p>So to summarise my question: How can I reload Galleria once the new images have been loaded into the DOM?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload