У меня это реализовано так:
1) Невидимость.
Сам iframe обернут в div.
Первоначально этот div имеет стиль
display: none, а при вызове функции показа данному блоку задается стиль
display:run-in (можно также использовать display:block, сейчас не упомню уже, почему именно run-in использовал).
Делается это с помощью такой конструкции
Код:
var divnode = document.getElementById('divcont' + curContent);
divnode.className = 'vis_on';
,
При этом в сам iframe загружается целевая страница уже известным вам способом. То есть нечто аналогичное нужно добавить в вашей JS-функции.
Классы для показа/скрытия:
Код:
.vis_on {
display:run-in;
}
.vis_off {
display: none;
}
Соответственно изначально на упомянутый <div> назначен класс
vis_off.
2) Позиционирование блока с iframe -
position:absolute; z-index:2 , ну и размещен он где нужно над страницей.
Позиционирование блока с флешкой -
position:absolute; z-index:0, также расположен, где нужно.
Как удобнее работать - первоначально отключить невидимость блока с iframe, и задать бордюр, чтобы удобнее было подгонячть на странице.
Посмотрите код на странице примера, который я привел, возможно что-то поможет.
Вот выдранный оттуда кусок с iframe:
Код:
<div id="divcont2" style="position:absolute; left: 390px; top: 80px; width: 484px; height: 236px; z-index:2;" class="vis_off">
<iframe id="cont2" src="about:blank" name="cont2" frameborder="0" width="484" height="236" marginwidth="0" marginheight="0" scrolling="auto" allowtransparency="true" style="background-color:transparent;"></iframe>
</div>
Что касается скроллига внутри самого iframe, то устанвленный scrolling="auto" - тут чисто мой случай, сами страницы не должны вылезать по ширине за размеры iframe, а должна появляться только вертикальная прокрутка. У меня это достигается фиксацией ширины в вверстке самих страниц.
В общем покропеть тут придется, нюансики есть. Но схема, приведенная мною выше, работает успешно, и даже довольно кроссбраузерна.