Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Jonathan Seligsohn
Jonathan Seligsohn
23,116 Points
Posted by Jonathan Seligsohn
Jonathan Seligsohn
23,116 Points

Mobile device detection

There is a lot of discussion about mobile-first design and use of media queries to create a fully responsive site. That's great - when your screen size varies and you're having CSS issues, media queries are the way to go.

However, I've run into a different problem - it's not that the layout doesn't work on variable screen sizes, rather certain features/plugins (oftentimes in JS) don't work on mobile devices (e.g. video players on iOS). What's the recommended way to detect if an end-user is on a mobile browser and adapt accordingly?

2 Answers

Aaron Graham
Aaron Graham
18,033 Points
Aaron Graham
Aaron Graham
18,033 Points

Modernizer might be what you are looking for. You can test the browser for available features and load different code based on the results. In short, it's awesome!

Matt Campbell
Matt Campbell
9,767 Points
Matt Campbell
Matt Campbell
9,767 Points

Can go one better than that with mobile-detect.php. You can detect what device you're on and load different files based on that.

http://mobiledetect.net/