How to disable background image/pattern in mobile devices

[vch]

So far so good with my personal customisation of Suffusion, nice looking and large number of options that enable us to create something unique and potentially outstanding. However, I haven't been able to work this out:

(For mobile devices) How to disable the background image/pattern (set to work in the regular theme for laptops, desktops), etc, and only see the 'Main Wrapper'? I use an image that is repeated throughout the background and looks very nice on my desktop screen, but the opposite on my mobile.

Thanks a lot for any insightful comments on this issue.

Cheers

[Colin]

The theme is not 'responsive' so you would need to have some custom javascript to identify that it is a mobile device and then turn off the background etc.

[vch]

Alright. Well, I believe there is strong demand for such a javascript, as lots of bloggers, webmasters, etc want to have a sophisticated site background for pcs/laptops/etc, but a sober, single color for mobile devices. I do not know javascript and do not have the time to learn just for a single application, so if someone knows of a similar or related code, please say so.

Thanks very much again.

Cheers

[sayontan]

Try using the "Mobble" plugin. It should assign a class to the "body" element for mobile devices. You can then use custom CSS to style that. E.g. you will be able to do this in your custom styles:

Code: Select all

body.mobile { background: none; }

However, note that the only difference between the mobile and desktop views will be this: your mobile users will not see the image, but the mobile browser will still load it. So in terms of bandwidth etc you are not gaining anything. In fact you are just adding some additional CSS code for no measurable performance benefit. This is, in general the issue with most approaches to responsive design, which focus more on the presentation rather than the real benefits.

[vch]

Thanks a lot Sayontan. One more thing, it's completely valid what you say about bandwidth, how about a solution that indeed gets rid of the background image and reproduces either a single color or nothing at all in mobile devices?

Cheers

[sayontan]

One more thing, it's completely valid what you say about bandwidth, how about a solution that indeed gets rid of the background image and reproduces either a single color or nothing at all in mobile devices?

Sure. Are you volunteering to build such a solution?

These things are easy to suggest, but tough to implement - a solution for this is going to take a lot of planning, time and effort.

[vch]

As I said before I don't have the time to learn javascript, etc just for a single application. If it exists, cool, if not, there's always a way around it.