Reply To: SquareOne background images not sizing properly on iPad and iPhone

Hi Wes. Thanks much for making this next on your checklist. Yes, InSync looks fine on the iPad and iPhone, both in landscape and portrait.

Here’s one tip I just found that may help identify the problem:

I viewed both demos in Chrome on my PC, grabbing and resizing the width of the browser width from almost full screen to the smallest width possible.

When doing this, there’s a very different behavior that occurs in the resizing of the background image in InSync vs. SquareOne.

The background image on InSync resizes dynamically as soon as you start to decrease the width of the browser window, and it has about six different variations in background image size that it uses as you drag the browser width to the narrowest available size.

By contrast, the background image on SquareOne stays at exactly the same size until you get to just under about 750 pixels in the width of the browser window, and it then only has one other background image size that it holds all the way down to the narrowest available width of the browser window. As a result, you’re seeing only a very small portion of the background image in a smaller sized window, which gives the effect that it has been zoomed improperly.

I suspect this behavior is not confined to the iPad, but is rather just an unfortunate coincidence of the iPad’s screen resolution and dimensions being at a particularly bad point of the image not resizing properly in SquareOne as it does in InSync.

I hope that helps to narrow down where in the code the two are different and results in a quick, easy fix.