I'm spitting out a bunch of images for a gallery and I'll like to calculate the total width of those images.
I was doing in jQuery and got it to work for one gallery but haven't figured out how to do it when I have multiple galleries on the page as it was adding up all images on the page, not just the ones per gallery. So I thought maybe a function in my controller would be a better route. So, I'm looking for help with the function to do the calculation.
in my template I have:
<% control PortfolioWorks %>
<div class="scroll-pane">
<% control PortfolioImages %>
<img class="portImage" src="$Attachment.URL" width="$Attachment.width" height="$Attachment.height">
<% end_control %>
</div>
<% end_control %>
or if you think jQuery is the best option, this is what I have so far:
I figured I could make the above class - class="scroll-pane$Pos" but not sure how to do address that in the script without writing it a bunch of times, one for each… scroll-pane1, scroll-pane2, etc.
var totalWidth = 0;
$('.scroll-pane img').each(function() {
totalWidth += $(this).outerWidth();
$('.scroll-pane').css("width", totalWidth);
});
thanks