title: Detect max video resolution support for a mobile device on responsive website
body: <p>As the title says, I'm searching for cross-browser and mostly cross-platform solution for displaying html5 videos <strong>of different size resolutions</strong>. My main issue is that if a high resolution video is accessed from a standard/low definition device, it will not be played as the native video application can't handle it; this is mostly true on older/low-budget android devices, which have a standard or low display resolution.</p>
  
  <p>My best guess was to filter the video source file based on the device width mediaquery, with something like <code>if width &lt; 480 --&gt; use low-res video</code> but this will probably exclude capable high end devices like iphones, galaxyS2+, and so on..</p>
  
  <p>In the end I'm asking if there is something to query like "max video resolution support" or similar. I know there is something in the Android API, but I don't know if it can be used in this situation..</p>
  
  <p>Below some links I've found for reference:</p>
  
  <p><a href="http://www.genuitec.com/mobile/docs/encodingVideo/encodingVideo.html" rel="noreferrer">http://www.genuitec.com/mobile/docs/encodingVideo/encodingVideo.html</a>
  <a href="http://developer.android.com/guide/appendix/media-formats.html#recommendations" rel="noreferrer">http://developer.android.com/guide/appendix/media-formats.html#recommendations</a>
  <a href="http://developer.android.com/reference/android/media/CamcorderProfile.html" rel="noreferrer">http://developer.android.com/reference/android/media/CamcorderProfile.html</a></p>