I need to mimic what facebook photoviewer is doing. When slide showing the pictures, the container div size will grow to the picture size, but the container never shrink if next picture size is smaller than the current container size. i.e. the container size only grow but never shrink.
We are using angular-ui/bootstrap to creating a slide show. Code as:
<uib-carousel carousel-controls interval="screenshotModalCtrl.myInterval" no-wrap="screenshotModalCtrl.noWrapSlides" no-transition="screenshotModalCtrl.noTransition">
<uib-slide ng-repeat="screenshot in screenshotModalCtrl.screenshots track by $index" active="screenshot.start">
<img class="carouselImg" ng-src="{{::screenshot.path}}">
</uib-slide>
</uib-carousel>
I would think I need somehow hook in a javascript function when the image swap to detect the image size of the slide and change the container div min-width.
Anyone has done similar task? Any example I can refer to? Is my approach correct and how to do that?
Thanks.