Можно ли сделать на сайте баннер, который будет отображаться только для мобильных устройств?

Question

[Сергей Горчаков]

Добрый день.
Хочу поставить на сайт элемент, который будет отображаться только для мобильных устройств. Возможно ли такое сделать и есть ли готовые способы или примеры?
Заранее спасибо.

Answer 1

[Дима Паутов]

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());
	        }
	    };

    if(isMobile.any()){
// Тут то, что должно работать на мобильных устройствах
    }

Еще есть https://github.com/matthewhudson/device.js?

Comments

[Сергей Горчаков]

Заранее спасибо, попробую.

[Alex]

Сергей Горчаков: Есть еще подобный класс для РНР https://github.com/serbanghita/Mobile-Detect
Использовал его в нескольких проектах.

Answer 2

[WP Panda]

WordPress из коробки имеет функцию wp_is_mobile

if( wp_is_mobile() ) {
	echo 'бла бла бла' // бла бла бла  будет видно только на мобильных девайсах
}

Answer 3

[Evgeny Fatzilla]

Также можете попробовать медиа-запросы - habrahabr.ru/company/google/blog/173861

Например,

#mydiv {display:none;}
@media (max-width: 480px) {
    #mydiv {
        display: block;
    }
}

Comments

[Сергей Горчаков]

Тоже думал об этом, но все равно не то, сейчас мобильники с планшетами по разрешению чуть ли не на равных (если уже не на равных).

[Андрей Гончаров]

разрешение физическое и viewport разные вещи. У айфонов 5 например viewport 320px, хотя физическое разрешение больше гораздо. Медиазапросы работают со значениями разрешений viewport