Applet под Div и iFrame!

[Rezet]

Задача: Наложить полупрозрачный слой на java applet.

На сайте использую multibox для подгрузки подробной версии новости. В мультибоксе при клике на "Подробнее" стандартно создаётся полупрозрачный див 100 на 100 процентов + слой-рамка новости, а в этом слою в iframe подгружается полная новость. Всё работало отлично, пока я не поставил java applet на страницу(pjirc). Теперь аплет перекрывает даже оверлей, создаваемый мультибоксом. Погуглив, я выяснил, что апплеты как бЭ грузятся не браузером, а операционкой, потому это не проблема z-index'a... Самое нормальное решение нашёл ЗДЕСЬ. Для тех кто не шарит в английском, чел перекрыл апплет используя трюк iFrame shim. Он как бы сделал слой над фреймом, а фрейм над апплетом. Ну думаю, знающие люди уже поняли всё по коду скрипта (я просто совсен не знаю java script).

И к сожалению это решение не работает на Опере... А оперой то пользуется... дай Бог народа.

Можете исправить код, чтобы он работал и в опере?

И может кто-то тоже юзает multibox, помог добавить этот фикс в сприпт, наверняка многим это тоже пригодится!

[Rezet]

Ну как обычно мне никто не может ответить....

Нашёл косяк в скрипте создающем оверлей для multibox. Вот что он мне выдаёт:

<div style="overflow: hidden; position: absolute; left: 0px; top: 0px; width: 1242px; visibility: visible; z-index: 1; opacity: 0.7; height: 1016px;" id="OverlayContainer"><iframe style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; visibility: hidden; opacity: 0; z-index: 1;" src="java script:void(0);" name="OverlayIframe" id="OverlayIframe" scrolling="no" frameborder="0"></iframe><div style="position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 2; background-color: rgb(0, 0, 0);" id="Overlay"></div></div>

Хотя по идее он должен отображать это в такой структуре: <div><iframe><div></div></iframe></div>

Помогите, пожалуйста, исправить ошибку!

Код скрипта:

var Overlay = new Class({

	getOptions: function(){
		return {
			colour: '#000',
			opacity: 0.7,
			zIndex: 1,
			container: $(document.body),
			onClick: new Class()
		};
	},

	initialize:function(options)
	{
		this.setOptions(this.getOptions(),options);

		this.container = new Element('div').setProperty('id','OverlayContainer').setStyles({
			position: 'absolute',
			left: '0px',
			top: '0px',
			width: '100%',
			visibility: 'hidden',
			overflow: 'hidden',
			zIndex: this.options.zIndex,
			opacity: 0
		}).inject(this.options.container,'inside');

		this.iframe = new Element('iframe').setProperties({
			id: 'OverlayIframe',
			name: 'OverlayIframe',
			src: 'java script:void(0);',
			frameborder: 0,
			scrolling: 'no'
		}).setStyles({
			position: 'absolute',
			top: 0,
			left: 0,
			width: '100%',
			height: '100%',
			filter: 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)',
			opacity: 0,
			zIndex: 1
		}).inject(this.container,'inside');

		this.overlay = new Element('div').setProperty('id','Overlay').setStyles({
			position: 'absolute',
			left: '0px',
			top: '0px',
			width: '100%',
			height: '100%',
			zIndex: 2,
			backgroundColor: this.options.colour
		}).inject(this.container,'inside');

		this.container.addEvent('click',function(){
			this.options.onClick();
		}.bind(this));

		this.fade = new Fx.Morph(this.container);
		this.position();

		window.addEvent('resize',this.position.bind(this));
	},

	position: function(){
		this.container.setStyle('height','0');//reset container height ready for resize( removes scrollbar so new calc is true - liam)
		if(this.options.container == document.body){
			if(this.options.container.getSize().y >= this.options.container.getScrollSize().y){
				this.container.setStyles({
					width: window.getSize().x+'px',
					height: window.getSize().y+'px'
				});
			}else{
				this.container.setStyles({
					width: window.getSize().x+'px',
					height: window.getScrollSize().y+'px'
				});
			}
		}else{ 
			var myCoords = this.options.container.getCoordinates(); 
			this.container.setStyles({
				top: myCoords.top+'px',
				height: myCoords.height+'px',
				left: myCoords.left+'px',
				width: myCoords.width+'px'
			});
		};
	},

	show: function(){
		this.fade.start({
			opacity: this.options.opacity,
			visibility: 'visible'
		});
	},

	hide: function(){
		this.fade.start({
			opacity: 0,
			visibility: 'hidden'
		});
	}
});

Overlay.implement(new Options);

[Rezet]

Совершенно без знания скриптов сделал так:

show: function(){
		this.fade.start({
			opacity: this.options.opacity,
			visibility: 'visible'
		});
		this.iframe.setStyles({
			opacity:1
		});
	},

hide: function(){
		this.fade.start({
			opacity: 0,
			visibility: 'hidden'
		});
			this.iframe.setStyles({
			opacity:0
		});

Это позволило добиться нужного результата, НО в Opera апплету насрать на точто его перекрывает фрейм... Я вижу один вариант при клике присвоить visibility:hidden аплету, но как это вставить в этот скрипт???