Blurry parallax image in Review

Jun 03, 2021

Hi Folks! I made my first parallax interaction and when I publish to Review it is SUPER blurry and seems to get slightly better then worse then slightly better--like it is trying to focus the image but can't quite. It is also much worse when the cursor is in the player frame and not on the image. If I preview the slide only, it is better (Still blurs when the cursor is on the player). I am hoping this is happening because Review maybe publishes a lower-resolution version of the course and when I actually publish to the LMS it will look right? My image is huge--probably bigger than it needs to be because I thought perhaps it was a resolution problem and increased the size.  I am currently using a JPG, but I have tried different formats. Here is a link to a screen recording demonstrating what it looks like. The first example is on Review, the second is from "Preview: This slide only."   Thanks!

11 Replies
Kristin Warehime

Thanks, Tom. Removing the hover keeps it from moving in and out of focus, but it is just always blurry now. (see image)

So, is the quality I see in Review the quality I will see when published? Is there a certain size and/or resolution recommended for a parallax slider? 

Tom Kuhlmann

If the image quality is better as a hover, you can play around with setting that state as the initial state.

I have the webinar on parallax and there's a template I use when I do that effect. Keep in mind, you're inserting a massive image into the thumbnail of the smaller slider; so it is a bit of a hack and not really how the slider is designed to be used. There will always be some degradation when you scale an image down. 

You can also play around with your course size because that gives you more pixels and may help preserve some of the image quality. Example: if you bring a 3000x2000 (6 million pixels) into a slider in a course that is 720x540 (388,800 pixels) you can see that's a lot of pixels that are removed.

Kristin Warehime

Thanks, Tom and Renato, for your help! I was able to significantly improve the visual quality of the parallax interaction. I deleted the hover state and that kept it from changing focus. I increased the slide size and decreased the image size and resolution to ease compression. I will probably tweak it a bit more, but now I know it can be saved and I can use this in my course. :-)