Tablet Detection

html jquery-mobile tablet mobile-devices
Phill Pafford picture Phill Pafford · Feb 28, 2011 · Viewed 8.3k times · Source

Okay I got some good advice for Mobile Detection but still having an issue with themed tablets as the icons will be larger for a tablet view then a mobile device. I'm using jQueryMobile as the framework and it does detect the iPad (And I'm sure other tablets are on the way), but how can I detect if it's a tablet or mobile device? would I just go with the screen size?

If that's the case than what's the largest screen size for a mobile device or the smallest screen for a tablet?

is there a better way?

Answer

naugtur picture naugtur · Mar 1, 2011

jQuery Mobile adds classes to the body tag which allows you to create a single CSS for all the devices.

See here: http://jquerymobile.com/demos/1.0a3/#docs/api/mediahelpers.html

update

As of beta2 helpers will be deprecated and set for removal. You should take a look at media queries which were used to put these classes in there anyway.

Related questions

jQuery Mobile: document ready vs. page events

I am using jQuery Mobile, and I am having trouble understanding differences between classic document ready and jQuery Mobile page events. What is the real difference? Why should <!-- language: lang-js --> $(document).ready() { }); be better than $(document).…

Read More
Jquery change <p> text programmatically

EDIT: The solution was to add this to the profile page instead of the gender page. $('#profile').live( 'pageinit',function(event){ $('p#pTest').text(localStorage.getItem('gender')); }); I have a paragraph with som text in a listview that I …

Read More
How to check whether a select box is empty using JQuery/Javascript

I have a select box that is being populated dynamically from a database. As of right now the population of this check box is working flawlessly. I have added functionality that consists of a button which on click calls isSelextBoxEmpty. …

Read More