Search code examples
jqueryappendresponsive-slides

Moving elements around on page load using js

http://cccw.ecologik.net/ResponsiveImageGallery/

I am working with this Elastislide Carousel Thumbnail Viewer which I love. I am simply trying to move the thumbnails to the bottom of the viewer as opposed to the top. I don't think this is a css issue but one that occurs on the build using the gallery.js file. It is doing all kinds of append. to the parent div but I still can't find where the thumbs are created and shown. Regardless of where I move the thumb div in the code it just keeps going to the top. How do I best interpret the .appends that are going on here?

Solution

  • Change line 171 of gallery.js from:

    $('#img-wrapper-tmpl').tmpl( {itemsCount : itemsCount} ).appendTo( $rgGallery );

    to

    $('#img-wrapper-tmpl').tmpl( {itemsCount : itemsCount} ).prependTo( $rgGallery );

    The gallery viewer HTML is generated using jQuery Templates and inserted into the DOM dynamically. Using prepend instead of append will add the gallery viewer before the carousel.