Forum OpenACS Development: Re: Mobile Theme?

Collapse
4: Re: Mobile Theme? (response to 3)
Posted by Ryan Gallimore on
Hi Dave,

I've been looking into this as well and it seems media queries in CSS work well. Content is adapted to different device widths using something like:

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
// css rules go here
}

You can exclude large images, for instance, with display:none.

Probably the best implementation I've seen of an adaptive mobile display is here: http://www.ecentricarts.com. After poking through their CSS it looks like they used a similar rule.

There are other ways of doing it, like server side detection, but this seems the most common. This allows you to develop one theme package for many devices.

Regards,
Ryan