Archived

This topic is now archived and is closed to further replies.

  • 0

Completely hide background image - mobile


Question

Posted · Report post

Hi there,

 

I'm currently trying to figure out how to hide a fixed background image for mobile (just iphone initially...)?

 

In the custom css area i've added (as per the documentation on the browser-specific CSS plugin):

 

body.iphone { background-image: none;
}

 

However, that doesn't seem to be working for me.

 

I've then had a look in Firebug and I noticed that the image has the style-id 'pagelines-page-bg', so I tried:

 

body.iphone.pagelines-page.bg {background-image:none;}

 

but still no luck.

 

Any clues? I'm kinda stuck until I figure this out...

 

Cheers and thanks

Share this post


Link to post
Share on other sites

4 answers to this question

Posted · Report post

Hi,

 

The background image is assigned to the body tag, therefore thats the reason why your code isn't work. If you inspect your website using Firebug or your browsers web dev tools, you will see that the image is assigned to the page-canvas div.

 

Therefore, you need to adjust your code to include .page-canvas.

 

For example:

body.iphone #page .page-canvas { 
background: none;
}

Share this post


Link to post
Share on other sites

Posted · Report post

Sure, I've got this issue on a few sites, but the one i can make 'live' for now is www.elrenomusic.com

 

Cheers

Share this post


Link to post
Share on other sites

Posted · Report post

Superb work - thanks very much for your help.

 

Cheers

Share this post


Link to post
Share on other sites

Posted · Report post

Hi,

 

May I have a link to the site? Thanks.

Share this post


Link to post
Share on other sites