Switch theme based on screen size

Question

I need to switch my theme based on the users screen size instead of their user agent. Currently I'm using the Browscap & Mobile Switch modules and they work perfectly. My problem is that for tablets, I want users to use the desktop site. For mobile phones or anything under a 7 inch tablet, I want users to use my mobile site. What modules can help me with this OR how can I create the switch based off screen size?

UPDATE: I've just found ThemeKey. Anyone know if using this in conjunction with Browscap/Mobile Switch will cause issues?

Answer 1

The ThemeKey module is definitely the way to go for this. Here is a quote about it (from the module's project page):

... allows you to define simple or sophisticated theme-switching rules which allow automatic selection of a theme depending on current path, taxonomy terms, language, node-type, and many, many other properties. It can also be easily extended to support additional properties exposed by other modules. In combination with Drupal's theme inheritance you can easily achieve features like:

• individually-styled channels
• a front-page / "splash" screen
• a date/time-selected Christmas theme
• mobile themes for different auto-detected mobile devices
• special themes for "limited" or "old" browsers
• content, user, or role -specific themes
• indicating your environment (production, staging, testing, sandbox, … )
• testing your redesign safely on a live server