Question

我试图通过图像显示某些类别，在悬停时图像变大，其他图像变小，悬停的图片会变暗，并会出现一个按钮。这一切都有效。然而，事后它不会回到其原始状态。

http://codepen.io/lucymacgregor/pen/jyJOBj ^那就是我得到的代码。

//Image Category size change effect
$('.cat-wrap div').hover(function() {
    $(this).css('width', '30%');
    $(this).children().css('opacity','1');
    $(this).siblings().css( "width", "16.5%");
});

我觉得这是一个mouseout问题，但我认为悬停功能已经解决了这个问题。

Answer 1

使用jQuery，您还需要提供其他转换：

//Image Category size change effect
$('.cat-wrap div').hover(function() {

  $(this).css('width', '30%');
  $(this).children().css('opacity', '1');
  $(this).siblings().css("width", "16.5%");

}, function() {
  $(this).css('width', '19.2%');
  $(this).children().css('opacity', '0');
  $(this).siblings().css("width", "19.2%");  
});

Answer 2

以下是您要查找的javascript示例：

＆＃13;

urllib2.urlopen()

＆＃13;

Answer 3

要使其恢复，您需要为mouseout事件添加处理程序。这只是将第二个回调参数传递给hover()方法。

$('.cat-wrap div').hover(function() {

      $(this).css('width', '30%');
    $(this).children().css('opacity','1');
      $(this).siblings().css( "width", "16.5%");

  }, function(){
    // mouse out function
});

悬停功能不会恢复到原始状态

3 个答案: