Today's Question:  What are you most afraid of as a programmer?        GIVE A SHOUT

Technical Article => Web =>  JavaScript

JS code to check different mobile devices

  sonic0002      2013-11-28 05:25:10      1,307    0    0

Today I come across a code snippet which uses JavaScript to check different mobile devices and then loads different CSS files accordingly. As we know that there are mobile devices with different screen sizes, it's always troublesome for web developers to develop cross browser and cross device compatible codes. Hope this one can help those who develop web apps on mobile devices.

// Check whether it's a mobile device
// wukong.name 20130716

if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
	if(window.location.href.indexOf("?mobile")<0){
		try{
			if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
				// Check whether the environment is Android|webOS|iPhone|iPod|BlackBerry
				setActiveStyleSheet("style_mobile_a.css");
			}else if(/iPad/i.test(navigator.userAgent)){
				// Check whether the environment is iPad
				setActiveStyleSheet("style_mobile_iPad.css");
			}else{
				// If other mobile devices
				setActiveStyleSheet("style_mobile_other.css");
			}
		}catch(e){
		}
	}
}else{
	// If it's other device
	setActiveStyleSheet("style_mobile_no.css");
}

function setActiveStyleSheet(filename){
	document.write("´╝ťlink href="+filename+" rel=stylesheet´╝×");
}

Here is the demo page(If you can understand Chinese) : Mobile_demo

Source : http://w3ctech.com/p/1524

JAVASCRIPT MOBILE DEVICE DETECTION

  SAVE AS PDF   MARK AS READ   MARK AS IMPORTANT

Share on Facebook  Share on Twitter  Share on Google+  Share on Weibo  Share on Reddit  Share on Digg  Share on Tumblr    Delicious

  RELATED


  0 COMMENT


No comment for this article.


  WRITE ARTICLE

Unexpected behavior due to a bug

By sonic0002