Hello

I submit scaling problem of background images on devices Ipad.
Boutique template. http://www.tenis-asir.pl/

Best regards

Hello

May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will examine this issue further. For our reference please paste a link to this post in your email.

Ciarán

Hello,

I have the exact same problem.

http://www.eskerfeldt.se

Looking forward to see the solution.

BR

Magnus

Hello

Thank you for bringing this issue to our attention. We hope to have now resolved this issue. To amend update your template to the latest download.. http://www.joomla51.com/tutorials/item/updating-your-template

Ciarán

Awesome as usual Ciaran!

That seems to have fixed the problem!

BR

Magnus

I'm sorry, but the problem still exists. In devices Iphone background image doesn't scale properly.

Best regards

Hi zbyszek

Please post a URL to an example of your issue.

Ciarán

example:
http://www.tenis-asir.pl

The problem seems to manifest itself again, on iPad/iPhone, when merging JS - I use ScriptMerge which works very very well at increasing page speed, but when Merge JS is enabled using J51 Boutique, the problem returns...

zbyszek: To better control the header background image size on smaller screen devices you can use the following custom CSS in conjunction with the CSS fields available within the 'Responsive Options' tab of your templates parameters, where 600px is the width your image will be displayed...

#header_bg {

    background-size: 600px auto !important;

}

cirymarr: Would you have a URL to an example of this issue?

Ciarán

Hi Ciarán

http://www.romanystone.com (I emailed you admin access the other day).

Hi Ciarán

To amend could you try adding the following to the Custom CSS field of your templates parameters...

/* disable background-size:cover */

.touch #container_header, .touch #header_bg, .touch #container_top2_modules, .touch #container_bottom1_modules, .touch #container_bottom2_modules {

	-webkit-background-size: auto !important;

	-moz-background-size: auto !important;

	-o-background-size: auto !important;

	background-size: auto !important;

	background-repeat: repeat !important;

	background-attachment: scroll !important;

}

Ciarán

Hello Ciarán,

Well I decided to change background and now it doesn't look that good on mobile devices.



I've followed your tips above but I can't get it to work properly.



I followed your advice and others on the webb to get it to look good on iPad, iPhone, etc.
The background just won't resize properly.

The address to my site is: http://www.eskerfeldt.se .

Please advice,

BR

Magnus

Hi Magnus

May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will examine this issue further. For our reference please paste a link to this post in your email.

Ciarán

Thank you Magnus

I have added the following to the 'Phone (Portrait) Custom CSS' field in the 'Responsive Options' tab of your templates...

.touch #header_bg {

    background-size: auto 600px !important;

}

Depending on your taste you may wish to edit this further where 600px is the height of your image.

Ciarán