Images displaying outside of module borders
February 24, 2014 12:00 AM
Hi all,
I have a module containing images which move beyond the RH edge of the module (eg: a large image which slides to the right to reveal more text). As it currently stands the image slides to the right, but is still visible outside of the RH boundary of the module, attached is an image explaining what I mean:
[ATTACH=CONFIG]533[/ATTACH]
An ugly hack to get around it is putting an 'always on top' white box immediately to the right of the RH border which masks the image, but this creates a horizontal scroll bar which my client is not happy with.
Does anyone know of a way to make the image not display outside of the borders of a module? Either on the LMS side or the Lectora side, perhaps by loading within an iframe?
It is being published to SCORM and hosted on Totara LMS.
Discussion (4)
I can think of two ways:
1. You can use jquery to move the image inside its DIV, then it won't be visible. When using the Lectora Move action the whole DIV is moved and the image will stay visible.
2. If you want to use the Lectora action you could move the image and use a "Change content" action after the movement to replace your image with a white rectangle.
Tim
You can place a solid white rectangle just off the slide and set it as "Always on top". So any actual images moved off slide will be underneath the white rectangle and therefore invisible. The only downside is that you cannot place anything outside slide borders when editing the project, so you'll have to do it via a Move-To action.
Hi all,
Thanks for your feedback! For anyone in a similar pickle, this ended up working:
1) Add an external HTML object to the specific page in question (not to the entire chapter/A001)
2) Set type to Meta tags
3) Edit and add this code:
I kept the white box as a mask however the horizontal scrollbar no longer appears.
Note that adding it as an external CSS document (as opposed to meta tags) didn't work for some reason...
I have noticed a similar issue with images sliding to the right in a template we designed in 10 and are migrating to 11. I really hope this doesn't mean alignment issues like this now have to be fixed with css??? :(
Thankfully I've only seen it on one minor thing that we can easily change... (I'm going to try making the image the background instead, hopefully that will work).
Discussions have been disabled for this post