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

Question

[Uladzimir A]

Подскажите пожалуйста, как при :hover правильно добавлять элементы. У меня есть галерея с изображениями, и при наведении на картинку, на ней появляется полупрозрачный фон со span'ами. Пробовал вот так

$('.thumb-img').hover(
       function(){ $('.show-more').addClass('show-more_visible') },
       function(){ $('.show-more').removeClass('show-more_visible') }

т.е. при наведении на изображение .thumb-img, элемент с классом .show-more получает класс .show-more_visible с display: block. И все бы хорошо, но при наведении на одну картинку фон появляется у всех. Как указать правильно, что нужно делать только для одного элемента?

Answer 1

[Алекс Меллер]

Для каждого .thumb-img используй onfocus

Answer 2

[Sergey]

Подходит?
Пример

Comments

[Uladzimir A]

Не совсем то... Здесь при наведении на элемент, класс добавляется ему же. Мне нужно - при наведении на изображение, на него сверху ложится другой элемент, со своим фоном и 2-мя мелкими изображениями.

Answer 3

[Uladzimir A]

Всем спасибо. Сам разобрался... можно было простым CSS сделать через :hover. Перемудрил сам.