0

我是 jQuery 新手，我想创建一个动画，当用户将鼠标悬停在社交图标上时，鼠标悬停的社交图标会弹起。

问题是，虽然它按预期工作，但它不是鼠标所在的图标上升，而是所有其他图标移动。

这是我的 jQuery 代码：

$(document).ready(function () {
$('.social-icons img').hover(function () {
    // on mouse over, move up   
    $(this).stop().animate({
        marginBottom: '7px'
    }, 200);
},
// on mouse out, move back to original position
function () {
    $(this).stop().animate({
        marginBottom: '0px'
    }, 200);
});
});

请在此处查看我的代码：http: //jsfiddle.net/marvinjobs/4pcJ8/7/

我遇到的另一个问题是我在 index.html 页面上包含了代码，虽然它在 www.marvinjobs.com/index.html 上加载，但在打开 www.marvinjobs.com 时它不起作用

我希望有人可以帮助我解决这两个问题！

4

1 回答 1

1

好的，像这样更新脚本...

请参阅 jsfiddle 上的演示... http://jsfiddle.net/4pcJ8/8/

对于 Q2：您是否正确包含了 jquery 库？

查询

$(document).ready(function() {
  $('.social-icons img').hover(function() {
  // on mouse over, move up     
      $(this).stop().animate({ 'marginTop':'-10px', 'padding-bottom':'10px' },200);
  },
  // on mouse out, move back to original position
  function() {
    $(this).stop().animate({ 'marginTop':'0px', 'padding-bottom':'0px' }, 200);
  });
});
于 2013-05-30T09:48:14.200 回答