Выезжающая панель на CSS3 с iframe внутри

Здравствуйте, уважаемые Хабро-CSS3-люди!
Хочу поделиться маленьким опытом создания выезжающей панельки на CSS3 с iframe внутри и тем, как побороть неприятные сюрпризы от IE. Это решение мне кажется хорошо подойдет для добавления на сайт формы обратной связи, чата с консультантом и т.п.
На всякий случай напомню, что у iframe есть свои минусы, и при создании сайта с iframe необходимо их учитывать. Есть и плюсы, однако топик не об этом.

Роль выезжающей панели будет играть div. Внутри него: еще один div — кнопка-заголовок и собственно iframe.

<div id="feedbackP">
	<div id="feedbackButton">
		Feedback
	</div>
	<iframe id="feedBackIframe" src="feedback.php"  scrolling="no" frameborder = "yes">
	</iframe>
</div>

Теперь стили с комментариями:

#feedbackP{
	width : 400px;
	height : 272px;
	position : fixed; /* фиксируем позицию в окне */
	z-index : 50;
	/* сдвигаем панель вправо вниз: */
	top : 100%; 
	left : 100%;
	/* выдвигаем краешек: */	
	margin-top : -25px;
	margin-left : -130px;

	border : 2px solid;
	border-radius: 10px;
	
	padding: 5px;
	
	/*задаем эффект движения: */
	-moz-transition:margin 0.3s linear;	
	-o-transition:margin 0.3s linear;	
	-webkit-transition:margin 0.3s linear;	
	-ms-transition:margin 0.3s linear;	
	transition:margin 0.3s linear;	
}
#feedbackP:hover{	 
	/* выдвигаем панель на всеобщее обозрение: */	
	margin-top : -272px;
	margin-left : -400px;
	/*задаем эффект движения: */	
	-moz-transition:margin 0.3s linear;	
	-o-transition:margin 0.3s linear;	
	-webkit-transition:margin 0.3s linear;	
	-ms-transition:margin 0.3s linear;	
	transition:margin 0.3s linear;	
}

/*Делаем заголовок панели, как уголок папки с бумагами: */
#feedbackButton{
	font-weight : bold;
	margin-left : 10px;
	margin-top : -6px;
	border : 1px solid #717277;
	border-radius : 0px 0px 10px 10px;
	text-align : center;
	width : 100px;
	margin-bottom : 5px;
	color : #FFFFFF;
	background : #717277;
}

#feedBackIframe{
	width : 390px;
	height : 240px;
	border : 1px solid;
}

Вот, что у меня получилось, когда панель выдвинута:


Казалось бы и все, но всеми любимая программа для скачивания браузера не может оставить нас без новогодних сюрпризов.

Во первых,

	position : fixed;

не работает в IE6. Для IE7 нужно указать DOCTYPE.
С border-radius и transition можно смириться.
UPD: (а с радиусом можно и не мириться: пруф by kafeman)
Ну а для тех, кто не хочет мириться с тем, что такая панель не будет работать в IE 6 — есть несколько приемов.
Я же наплевал на IE<9, т.к. все равно использую canvas HTML5.

Но и на этом сюрпризы IE не закончились. Как только мышка из div'a попадает в iframe внутри него, сам div перестает быть hover. Это приводит к тому, что появляющаяся панель сразу исчезает.
На помощь приходит небольшой скрипт на JS + JQuery, который надо включить, если браузер — IE:

<!--[if IE]>
	<script type="text/javascript">
		$('#feedbackP').live('mouseenter',function() {
		        $('#feedbackP').css('margin-top', '-272px');
		        $('#feedbackP').css('margin-left', '-400px');
	        });
		$('#feedbackP').live('mouseleave',function() {
		        $('#feedbackP').css('margin-top', '-25px');
		        $('#feedbackP').css('margin-left', '-130px');
	        });
	</script>
<![endif]-->

Кроссбраузерность:

• FF — да
• Chrome — да
• Safari — да
• Opera — панель всплывает не плавно, а рывком
• IE — панель всплывает не плавно, а рывком

Напоследок привожу пример в действии: клац. (по ссылке — панель справа внизу)
Вот и все, спасибо за внимание!