Есть ли флеш в браузере?


Появилась задача:

Как показывать на сайте для компьютеров флеш баннер, а для телефонов выдавать картинку?
Первые две мысли были в плане таковы:

  1. Использовать .htaccess для определения User Agent-а посетителя. Так мы делали, например, в этой статье – для перенаправления на мобильную версию.
  2. Использовать правила CSS для определения ширины экрана и выдавать то, что необходимо. Так мы делали здесь – изменяли разметку с помощью @media screen and.
Однако, еще немного подумав, пришло решение проще и правильнее. Совсем же необязательно, что смартфон не поддерживает флеш – это по умолчанию гугловский хром на последних андроидах так делает, но ест же и другие варианты, не правда ли? А ширину отображаемой страницы сам же посетитель может менять – просто изменяя окно браузера.

Так что идеальным будет такое решение, при котором сайт определяет, установлен ли flash плагин на гаджете посетителя и уже в зависимости от этого выдавать необходимый вариант. Сказано – сделано. Давайте напишем функцию, которая будет определять, есть ли флеш у посетителя.

Для этого воспользуемся обнаружением модулей в браузерах с помощью JavaScript. Нам понадобятся два массива: navigator.plugins и navigator.mimeTypes. Интересно, что это не обычные массивы: к ним можно обратиться по имени или индексу элемента, но не получится вывести все их перебором – запрещено из соображений безопасности.

Однако, нам и не надо узнавать их все: мы просто должны узнать, есть плагин с определенным именем в массиве. Точнее, два. Итак, вот функция:

function isFlash() {
	var flag = false;
	a = navigator.plugins["Shockwave Flash"];
	b = navigator.plugins["Shockwave Flash 2.0"];
	c = navigator.mimeTypes['application/x-shockwave-flash'];
	d = c.enabledPlugin;
	
	if (navigator.plugins) {
	if (a || b) flag = true;
	}
	
	if (navigator.mimeTypes) {
	if (c && d) flag = true;
	}
	
	return flag;
}
Метод выдает true или false в зависимости от того, обнаружен ли flash и включен ли он в браузере. Пользоваться им очень просто: проверяем и подставляем баннер или картинку как необходимо сделать в первоначальной задаче.

if (isFlash()) {
document.getElementById("rabbit").innerHTML = '<embed src="banner.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>';
}

else {
document.getElementById("rabbit").innerHTML = '<img src="banner.gif" />';
}
Кстати, вы сами можете проверить, работает ли и включен ли флеш в вашем браузере:

Автор этого материала - я - Пахолков Юрий. Я оказываю услуги по написанию программ на языках Java, C++, C# (а также консультирую по ним) и созданию сайтов. Работаю с сайтами на CMS OpenCart, WordPress, ModX и самописными. Кроме этого, работаю напрямую с JavaScript, PHP, CSS, HTML - то есть могу доработать ваш сайт или помочь с веб-программированием. Пишите сюда.

тегизаметки, javascript, браузеры, скрипты, flash




Отправляя сообщение я подтверждаю, что ознакомлен и согласен с политикой конфиденциальности данного сайта.




Хостинг за 60 рублей
Автоматическое копирование сайта и базы на яндекс диск
9 советов для разработчиков JavaScript