0

How can I disable rendering of one element on HTML page only on Android 4.3. and older?

On a page I've got an absolute positioned elements that renders over sites content making it impossible to read. In HTML code, elements are written before content and it works great on every device except Android 4.3. and older.

I've found a script for determining what OS is running on a device, but it works for Android in general, not the 4.3. and older versions.

Sites link is here and I'm talking about rotated elements used for background.

EDIT: I've managed to make some improvement. You can now see second half normally on Android 4.2, but I don't know why it doesn't work for the first two elements that has to be hidden as well.

Here is the code that worked particularly (found it here ):

var ua = navigator.userAgent.toLowerCase();
if( ua.indexOf("Android") >= 0 )
{
  var androidversion = parseFloat(ua.slice(ua.indexOf("Android")+8)); 
  if (androidversion < 4.4)
  {
      document.getElementById(rotate_section_1).style.display = 'none';
  }
}
Community
  • 1
  • 1
Miki Magić
  • 9
  • 3

1 Answers1

0

You're lowercasing the useragent string then looking for "Android" with a capital A.

Loggically I don't think navigator.userAgent.toLowerCase(); can ever contain the string "Android"

David Liam Clayton
  • 154
  • 3