Создание сайтов - блок поверх флеша
Первое, что нам необходимо - это сам флеш. Здесь мы немного отойдем от темы и коснемся способов публикации флеша, хотя, если Вам это не нужно, то Вы можете смело пропустить данный абзац. Способов публикации флеша несколько, но лично я использую SWFObject - это способ публикации на JavaScript. По сравнению с классическим HTML (способ, который, на мой взгляд, уже морально устарел) предложенный способ имеет существенные преимущества - вот некоторые из них:
- кроссбраузерный и соответствует стандартам;
- позволяет избежать необходимости активации Flash-ролика пользователем в Internet Explorer (это главное преимущество);
- простота публикации и минимум кода;
- можно задавать альтернативный контент в случае, если у пользователя не установлен Flash-плеер или стоит старая версия и т.д.
Итак, для публикации флеша данным способом необходимо скачать скрипт SWFObject (подробнее о нем можно прочитать на сайте разработчиков), включить скрипт в заголовке страницы и прописать код флеш-ролика:
<script type="text/javascript" src="swfobject.js"></script>
</head>
<body>
<!--Вставляем флеш-ролик-->
<div id="myclip">Здесь предупреждение, которое отобразится в случае, если у юзера не установлен флеш-плеер</div>
<script type="text/javascript">
var so = new SWFObject("Ваш флеш.swf", "mymovie", "Ширина флеша", "Высота флеша", "7", "#ffffff");
so.write("myclip");
</script>
</body>
Итак, 5 строк кода и 1 подключаеый скрипт - все, что необходимо для кроссбраузерной работы флеша на Вашем сайте. Для того, чтобы разместить что-то поверх данного флеша нам надо просто дописать в блоке подключения флеш-ролика 1 строку кода, в которой мы зададим необходимый нам параметр, и в стиле блока с флешем прописать z-index меньший, чем у блока, который будет перекрывать флеш.
Необходимый нам код будет выглядеть приблизительно так:
<script type="text/javascript" src="swfobject.js"></script>
</head>
<body>
<!--Вставляем флеш-ролик-->
<div id="myclip" style="z-index:1;">Здесь предупреждение, которое отобразится в случае, если у юзера не установлен флеш-плеер</div>
<script type="text/javascript">
var so = new SWFObject("Ваш флеш.swf", "mymovie", "Ширина флеша", "Высота флеша", "7", "#ffffff");
so.addParam("wmode", "opaque");
so.write("myclip");
</script>
<div style="z-index:2;">
<a class="picture" href="1.jpg">Что-то перекрывающее флеш</a>
</div>
</body>
Ниже приведены 2 примера: