Add Data Attribute of User Agent

0
0
JavaScript Data Attribute   User Agent
Share
  • You must to post comments
Filter
Sort by: Most Votes
0
0 
JS
var b = document.documentElement;
b.className = b.className.replace('no-js', 'js');
b.setAttribute("data-useragent",  navigator.userAgent);
b.setAttribute("data-platform", navigator.platform );

Which results in data attributes being added to the html element like:

HTML

<html 
	data-useragent="Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C)"
	data-platform="Win32">
	...

Which allows you to be able to target very specific browsers on very specific platforms with CSS:

CSS

html[data-useragent*="Chrome/13.0"][data-platform="Win32"] {
  ...
}

This was referenced from a post by Rogie King that has since gone offline.

  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.