问题描述
我想做什么:
悬停图像 1 时将图像 2 向下移动 5px:
我不懂代码(一点点 CSS),但我认为这个可以帮助我做我想做的事,当然它不起作用,你能告诉我为什么吗?
jQuery(document).ready(function($){
$('.image1').on('mouseenter',function() {
$(".image2").addClass("move5px");
});
});
$('.image1').on('mouseleave',function() {
$(".image2").removeClass("move5px");
});
我使用的类:
.move5px{
top:-5px
}
解决方法
好的,这是工作代码(添加了#id名称):
jQuery(document).ready(function($) {
$('#image1').on('mouseenter',function() {
$("#image2").addClass("move5px");
});
$('#image1').on('mouseleave',function() {
$("#image2").removeClass("move5px");
});
});
以及为动画添加过渡的 css :
#image2 { transition: 150ms; }
.move5px{
padding-top:5px;
}