Set min. height to background image on intro

Also, made sure that the image always covers the background.
HFJ-1815
pull/4/head
Frode Petterson 2016-04-15 09:30:27 +02:00
parent 2745b6b414
commit c045d440d9
1 changed files with 5 additions and 3 deletions

View File

@ -405,13 +405,15 @@ H5P.QuestionSet = function (options, contentId) {
if (params.introPage.backgroundImage !== undefined) { if (params.introPage.backgroundImage !== undefined) {
var $intro = $myDom.find('.intro-page'); var $intro = $myDom.find('.intro-page');
if ($intro.length) { if ($intro.length) {
var bgImg = params.introPage.backgroundImage;
var bgImgRatio = (bgImg.height / bgImg.width);
$intro.css({ $intro.css({
background: '#fff url("' + H5P.getPath(params.introPage.backgroundImage.path, contentId) + '") no-repeat 50% 50%', background: '#fff url("' + H5P.getPath(bgImg.path, contentId) + '") no-repeat 50% 50%',
backgroundSize: '100% auto' backgroundSize: 'auto 100%',
minHeight: bgImgRatio * +window.getComputedStyle($intro[0]).width.replace('px','')
}); });
} }
} }
var registerImageLoadedListener = function (question) { var registerImageLoadedListener = function (question) {
H5P.on(question, 'imageLoaded', function () { H5P.on(question, 'imageLoaded', function () {
self.trigger('resize'); self.trigger('resize');