ion-gallery
ion-gallery copied to clipboard
Thumbnails are not used in final html, the resulted thumbnail is 14px height
Hi there,
Nice plugin. I tried to use but the final HTML discards the thumb image I passed to it
<ion-gallery ion-gallery-items="galleryData" ion-gallery-actionLabel="{{'CLOSE'|translate}}" ></ion-gallery>
The final results looks like this
<img ion-image-scale="" ng-src="http://d1c7z8qwf20y92.cloudfront.net/thumb/65/500x500/2147483647/5475.jpg" ng-click="showImage(0,0)" src="http://d1c7z8qwf20y92.cloudfront.net/thumb/65/500x500/2147483647/5475.jpg" height="14px" data-pin-nopin="true" class="">
</div><!-- end ngRepeat: photo in item track by $index -->
<div class="gallery-view" ion-gallery-items="galleryData" ion-gallery-actionlabel="Close">
<!-- ngRepeat: item in items track by $index --><div class="row" ng-repeat="item in items track by $index" ion-row-height="" style="height: 0px;">
<!-- ngRepeat: photo in item track by $index --><div ng-repeat="photo in item track by $index" class="col col-33 image-container">
<img ion-image-scale="" ng-src="http://d1c7z8qwf20y92.cloudfront.net/thumb/65/500x500/2147483647/5475.jpg" ng-click="showImage(0,0)" src="http://d1c7z8qwf20y92.cloudfront.net/thumb/65/500x500/2147483647/5475.jpg" height="14px" data-pin-nopin="true" class="">
</div><!-- end ngRepeat: photo in item track by $index -->
</div><!-- end ngRepeat: item in items track by $index -->
<div ion-slider=""></div>
</div>
What's the structure of the object your passing ?
Is the issue that the thumbnail becomes too small ?
Hello. The same issue. Natural size is 200x200 px. I think there is something wrong in line
element.css('height',element[0].offsetWidth * parseInt(scope.$parent.responsiveGrid)/100 + 'px');
https://github.com/pedroabreu/ion-gallery/blob/master/dist/ion-gallery.js#L209
Is this still an issue ?
I think it is. I've tried newest version, height is 0 (maybe I've made wrong structure of items, the structure is [{"src":"http://gallerytest.easybusy.net/media/galleries/2d379ed60f329caa7e05f925c004312a_S7Uxfmz.png?md5=1e62a108e93fa31a98f3747449b325df","thumb":null,"sub":null},{"src":"http://gallerytest.easybusy.net/media/galleries/22beb51c16be835a2322e7d1654d0a0b_AAUK1zS.jpg?md5=5c5a3c849d0ac16d298f149ac453922b","thumb":null,"sub":null},{"src":"http://gallerytest.easybusy.net/media/galleries/ea2b707f4802a823712ac7293d82ec64_6hrJ5Xx.jpg?md5=8e573106c153fecb4e48a3e6624abdfc","thumb":null,"sub":null},{"src":"http://gallerytest.easybusy.net/media/galleries/edb8f55f01029aeb2daab759310c6702_f6dIeAg.gif?md5=6750559bfe9644a877a62eb62ebef180","thumb":null,"sub":null}]
).
Temporary I replaced with natural height
element.attr('height',element.parent()[0].offsetHeight+'px');
Testing in newest version
You're getting 0 because you're passing the thumb property as null (And that's the image rendered as the item in the gallery). That's why you don't have src attribute on the image.
As it is, either you don't define the property at all (just remove it from the object) or you need to define it's value.
It's a bit silly as it is, I'll fix it in the next days