Question

我已经好几天了，并且可以利用一些洞察力让它发挥作用。我需要做的是并排放置两个图像，然后对每个图像进行悬停效果，将标题滑动到另一个图像上。我继续通过示例来处理在悬停的图像上滑动标题，但由于某种原因，我甚至无法使其工作。我确定我错过了一些东西而且我不想使用插件，因为尽管我有困难，但这应该足够简单，可以添加到我的代码中。

以下是我目前使用的代码的小提琴：http://jsfiddle.net/paulmz/h8L82/1/

这是一段代码片段（我不知道为什么这是强制性的）：

    $('#activeSub2Left img').hover(function() {  
    $(this).find('.captionRight').stop().animate({ right: '470' }, { duration: 1600});  
    }, function() {  
    $(this).find('.captionRight').stop().animate({ right: '0' }, { duration: 1600});  
}); 

$('#activeSub2right img').hover(function() {  
    $(this).find('.captionLeft').stop().animate({ left: '470' }, { duration: 1600});  
    }, function() {  
    $(this).find('.captionLeft').stop().animate({ left: '0' }, { duration: 1600});  
});

谢谢！

Answer 1

当您在查看.captionRight时，您正在.captionLeft中寻找img和parent()：

$('#activeSub2Left img').hover(function() {  
  $(this).parent().find('.captionRight').stop().animate({ right: '470' }, { duration: 1600});  
}, function() {  
  $(this).parent().find('.captionRight').stop().animate({ right: '0' }, { duration: 1600});  
}); 

$('#activeSub2right img').hover(function() {  
  $(this).parent().find('.captionLeft').stop().animate({ left: '470' }, { duration: 1600});  
}, function() {  
  $(this).parent().find('.captionLeft').stop().animate({ left: '0' }, { duration: 1600});  
});

相邻div上的Jquery水平滑动字幕

1 个答案: