Question

我有一个图像标记，可以在悬停时更改图像。我希望这个过渡顺利进行。有点像淡入下一个图像。这是我现在的代码：

$('img').bind('mouseenter mouseleave', function() {
    $(this).attr({
        src: $(this).attr('data-other-src') 
        , 'data-other-src': $(this).attr('src') 
    })
});

我是javascript的初学者

Answer 1

更改ms值以获得更快/更慢的转换，淡出然后再返回

＆＃13;

$('img').bind('mouseenter mouseleave', function() {
  var self = $(this);
  self.fadeTo(1000, 0.30, function() {
    self.attr({
      src: self.attr('data-other-src'),
      'data-other-src': self.attr('src')
    });
  }).fadeTo(500, 1);
});

＆＃13;

Answer 2

替换$(document).keydown(function (event) { if (event.which === 37 && event.ctrlKey) { console.log('ctrl-left'); } if (event.which === 39 && event.ctrlKey) { console.log('ctrl-right'); } else { console.log('nothing detected'); } });属性是＆＃34;残酷的＆＃34;：你无法转换它。

为了做到这一点，至少在过渡期间你需要在DOM中存在2个图像。

javascript的图片转换

2 个答案: