I want separate css file for iphone and another css for other mobile device. And Use the iphone.css if iphone is detected or responsive.css if other mobile device is detected using prototype.js. How can I do that. Please help.


You do not need prototype particularly, JavaScript itself can do the trick:

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());

In your particular case you can:

| improve this answer | |
  • Yes this is working but I don't know the process to add an external css file if iOS is detected. – AKSHAYA KUMAR Satapathy Jan 21 '16 at 6:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.