Set min. height to background image on intro
Also, made sure that the image always covers the background. HFJ-1815pull/4/head
parent
2745b6b414
commit
c045d440d9
|
@ -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');
|
||||||
|
|
Loading…
Reference in New Issue