Image-Mouseover, появляется кнопка

Question

У меня есть тестовая страница:

http://www.youmethem.com/test/divdiv.html

То, что я хотел бы создать:

При наведении курсора на изображение, черную кнопки с текст и ссылки появятся. Если вы оставите изображение с помощью мыши, кнопка (с текстом и ссылками) исчезнет.

Как я могу создать это? Это должно быть работа с IE6-7.

PS: Я использовал это, чтобы отцентрировать кнопку над изображением: CSS-Вертикаль-центр-решение

Update:

Что касается ответа Dobiatowski в:

Вот мой CSS решение (меновская техника). Ссылка на последнюю версию: link text

Мышь отлично работает с IE6 и всеми современными браузерами. Но у меня есть некоторые ошибки отображения.

Есть ли способ их исправить?

IE 8/9 AN все современные браузеры (оптимальный)

IE 7 (появится кнопка позади правого изображения - ошибка)

IE 6 (появляется кнопка за правое изображение, граница сломанный - ошибка)

Answer 1

вы можете сделать это в CSS или JavaScript

JavaScript:

<img onmouseover="document.getElementById('div12').style.display = 'block';" 
onmouseout="document.getElementById('div12').style.display = 'none';" src='img.jpg'/> 

проблема будет, когда вы наводите мышь на div, поэтому img fireup onmouseout event.