Как получить DIV после того, как вы наведите курсор мыши на изображение/ссылку/другой div?

Question

Я сделал это раньше, но, к сожалению, я забыл. Я сделал это с помощью простого CSS, поэтому javascript или jquery не должны использоваться. Все, что я хочу, это показать A, а для B - показывать, когда вы наводите курсор на A.

Кроме того, если бы вы могли показать мне, как это сделать, вы также можете показать мне, как использовать скользящий анимация на скрытом div? Итак, когда вы нависаете над A, B скользит?

Answer 1

Вот несколько чистых CSS, которые не будут работать в IE 6. Он включает в себя упаковку контейнера #outer вокруг ссылки и поля (#tooltip). Конечно, в реальном приложении вы, вероятно, захотите установить поле, используя абсолютное позиционирование.

#tooltip { 
    display: none; 
} 

#outer:hover #tooltip { 
    display: block; 
} 

И HTML (try it):

<div id="outer"> 
    <img src="http://www.google.com/images/logos/ps_logo2.png"> 
    <div id="tooltip">Hello, world!</div> 
</div> 

Для анимации, вы лучше с помощью JQuery или другую библиотеку JS, потому что поддержка браузера для CSS3 анимации в настоящее время довольно беден.