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

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

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

Первые две мысли были в плане таковы:

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" />';
}

Кстати, вы сами можете проверить, работает ли и включен ли флеш в вашем браузере:


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