Adapt Learning Community: Extension "BackgroundScroll" on iPhone

Hi,

has anyone experience with the BackgroundScroll extension on iPhones?

I'm working with the Adapt Authoring Tool v0.8.0. and on page level, I assigned the BackgroundScroll feature to article.
On the page itself, the background of the blocks and articles that use the backgroundScroll feature are transparent and therefore basically the BackgroundScroll images which are lying beneath are visible, at least on Windows and Android - but not if I take a look at the course on the iPhone.
Has anyone had the same problem? Or any idea what might be the reason for this problem and how to solve it?

Regards,
Christina

PS: By the way...I took a look at the example of the BackgroundScroll extension at the official demo page (https://danielstorey.github.io/adapt-demo-course/#/id/co-main) and what shall I say - this one is working on the iPhone!
But actually, it seems that in this example the BackgroundScroll feature is used as a COMPONENT while in the version you can download for use (the one that I have installed) the feature can only be used upon articles or blocks and is not a component. So, now I'm a little bit confused and wondering why the version from the demo is not been offered for download...

Just in case that one isn't working for you I also made a similar background extension you can download it here and uploaded it into your instance....

https://github.com/mike-st/parallax-background-switcher

That a side it could be your Version of iOS if it is an older version, make sure you phone is up to date or the extension as been updated and perhaps that feature was changed by mistake. Which means the demo is using an older version of that extension that works.

Show parent | Reply

Hi Mike,

thanks a lot for those hints!

I will give them a try...

Kind regards,

Christina

Show parent | Reply

Hi Christina.

Yes this used to enjoy life as a component, which I kind of preferred as I like using it twice in a block to step the user through a model with changing backgrounds per step. The component version (v1.0.3) is still available here.

Having said that I can't seem to replicate your issue with the extension version on ios Safari. Are you sure you don't have any old background images blocking the view at block/component level?

Show parent | Reply

Hi Barry,

thanks for the hint! At last I downloaded the component version as well, but unfortunately I can't get it to work (independent of the system). Looking in the developer tools of my chrome browser I found out that somehow the structure of the component is not implemented properly (see image #1 - #2 shows how it should normally look like). But unfortunately I have no idea what might be the reason for this...

I also did some further investigation of the extension version of the BackgroundScroll feature on different Apple devices - iPad Mini, Mac OS (using Safari 12.1.1) and of course again the iPhone (iPhone 6S using Safari 12.1). And I found out that obviously the images are there, but they are - why ever - on the iPhone as well as on the iPad Mini (not on the Mac OS) scaled up in an exorbitant way (see image iPhone). And even if I see a picture, if I scroll down it ends and then there is nothing (see 2nd image of the iPhone).(The Android image shows the correct appearance: I have 2 images of the same situation - one at daylight, the other one at nighttime; by scrolling you can swap between them)

So, any idea what might be going wrong on the iPhone?

I really like the user to be able to change from day to night by his own action and would only reluctantly abandon it...

Kind regards,

Christina

Show parent | Reply

Ah the component issue was probably to do with your newer versions of AT/framework. I was using the component version in AT 0.6.5 / 2.3.3 on which I still have a number of courses to maintain.

What's defined for your background-size and background-attachment for the image issue in iOS? Something in iOS safari might be overriding. Happy to inspect and check it out if you can send me a sample zip of the issue. :)

Show parent | Reply

light-sample.zip

light-sample-export.zip

Hi Barry,

thanks a lot for your help!

Here are the zip files - one is the published course and the other one is the export version.

Maybe you'll find something I have been overlooking all the time...

Kind regards,

Christina

PS: The course actually uses its own theme. But unfortunately I could not use this original theme for the sample files, because the file size got over 10 MB. So I had to use the Vanilla theme. But this makes no difference to the problem with the BackgroundScroll extension...

Show parent | Reply

Hi Christina. The bg-scroll seems to be working fine in my iphone - both Safari (v12) and Chrome. I'm on iphone 6 iOS 12.3.1. Is this the correct behaviour below?

Show parent | Reply

Hi Barry,

yes, that's exactly what it should look like!
So this means the extension itself is working fine, but it's probably the surroundings that are causing a problem...

You didn't make any special adjustments or settings to your browser?

Show parent | Reply

No - no adjustments. Have you updated the iOS version in the iphone you were testing on?

Show parent | Reply