jQuery проблемы с отображением изображения

Question

Я работаю в jQuery, и я пытаюсь что-то сделать с помощью мыши. Когда я нахожусь над изображением, изображение будет расти, и появится небольшой текст ниже, но как я могу это сделать? когда я нажимаю на изображение, изображение поднимается, но когда я навеваю div, тогда пробелы пролетели. Есть ли способ остановить это?

$(".aImgContainer img").mouseover(function(){ 
    $(this).css({"transform":"translateY(-40px)"}); 
}); 

$(".aImgContainer img").mouseout(function(){ 
    $(this).css({"transform":"translateY(0px)"}); 
}); 

http://jsfiddle.net/mRHa5/

Answer 1

Попробуйте изменить верхнее положение, а не перевести? Мне также пришлось настроить несколько правил CSS.

$(".colofoonFoto").mouseover(function(){ 
    $(this).find('img').css({"top":"-40px"}); 
}); 

$(".colofoonFoto").mouseout(function(){ 
    $(this).find('img').css({"top":"0"}); 
}); 

http://jsfiddle.net/carasin/AraQT/2/

Answer 2

Там вы идете: jsFiddle

Я изменил события мыши, чтобы быть на контейнере .colofoonFoto вместо IMG. проблема заключалась в том, что когда вы наводили изображение, и оно поднималось - ваша мышь больше не была на нем