forked from platypush/platypush
Finally got a proper scaling for carousel widget pictures
This commit is contained in:
parent
e671a1294c
commit
37c6e25ac3
2 changed files with 10 additions and 9 deletions
|
@ -9,7 +9,6 @@
|
||||||
|
|
||||||
.carousel > img {
|
.carousel > img {
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
max-height: 100%;
|
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
height: 22.5em;
|
height: 22.5em;
|
||||||
}
|
}
|
||||||
|
|
|
@ -15,17 +15,19 @@ $(document).ready(function() {
|
||||||
|
|
||||||
var refreshImage = function() {
|
var refreshImage = function() {
|
||||||
var $oldImg = $imgContainer.find('img');
|
var $oldImg = $imgContainer.find('img');
|
||||||
var $newImg = $imgContainer.find('img').clone()
|
var $newImg = $('<img></img>')
|
||||||
.attr('src', images[processedImages++]).css('min-width', '')
|
.attr('src', images[processedImages++])
|
||||||
.hide().appendTo($imgContainer);
|
.attr('alt', 'Could not load image')
|
||||||
|
.appendTo('body').hide();
|
||||||
if ($newImg.width() > $newImg.height()) {
|
|
||||||
$newImg.css('min-width', '100%');
|
|
||||||
}
|
|
||||||
|
|
||||||
$newImg.on('load', function() {
|
$newImg.on('load', function() {
|
||||||
$oldImg.remove();
|
$oldImg.remove();
|
||||||
$newImg.fadeIn();
|
if ($newImg.width() > $newImg.height()) {
|
||||||
|
$newImg.css('width', '100%');
|
||||||
|
}
|
||||||
|
|
||||||
|
$newImg.css('max-height', '100%');
|
||||||
|
$newImg.remove().appendTo($imgContainer).fadeIn();
|
||||||
});
|
});
|
||||||
|
|
||||||
if (processedImages == images.length-1) {
|
if (processedImages == images.length-1) {
|
||||||
|
|
Loading…
Reference in a new issue