SL360: max-width, max-height
Jan 22, 2020
Hi there,
since the new version (January 22 2020) it is no longer possible to define the max-height and max-with of a published course (bevor you could alter the style for #preso in main.min.css, and everythings worked fine). Is there anyone out there, who knows about a workaround?
I found a workaround: jquery.
put the jquery.js into the directory html5/lib/scripts/
insert a new html-page (index.html) in the base directory of the course. Alter the imsmanifest.xml: change
<resource identifier="__6J5hCikf93B_course_id_RES" type="webcontent" href="index_lms.html" adlcp:scormtype="sco">
to
<resource identifier="__6J5hCikf93B_course_id_RES" type="webcontent" href="index.html" adlcp:scormtype="sco">
Add this to the Head of index.html:
<script type="text/javascript" src="html5/lib/scripts/jquery.js"></script>
<script type="text/javascript">
function sizeContent(){
var x = $(window).width();
if(x< 1185){
$('.myInner').css('width', $(window).width()+'px');
$('.myInner').css('height', $(window).height()+'px');}
else{
$('.myInner').css('width', 1185+'px');
$('.myInner').css('height', 874+'px');
var y = Math.trunc(((x - 1185)/2));
$('#inner').css('margin-left', y +'px');
}
}
</script>
<style type="text/css">
.myInner{
margin: 0 auto !important;
}
</style>
and the body:
<body style="overflow: hidden;">
<div id="inner">
<iframe src="index_lms.html" class="myInner" id='ght' frameborder="0"></iframe>
</div>
<script type="text/javascript" language="javascript">
$(document).ready(function () {
sizeContent();
$(window).resize(sizeContent);
});
</script>
</body>
it works just fine!
Be the first to reply
This discussion is closed. You can start a new discussion or contact Articulate Support.