Question

现在我正在使用jquery.transit开发幻灯片应用程序。我想要做的是在显示动画后隐藏照片。所以我设置了显示属性，转换并转换为“无”＃39;值。然后，幻灯片放映应用程序运行良好，但我注意到显示：在Chrome中的js控制台中没有设置显示。经过一些试验，我发现了一种启用display：none的方法，可以在我的代码中设置两次。有谁知道我的代码中有什么问题？也许我的js代码有一些问题。

  function showPhoto() {
    photo_list[counter]
      .css({
        scale   : 2,
        display : 'inline'
      })
      .transition({
        opacity : 1
      }, 1000)
      .transition({
        x : '+=20',
        y : '+=30',
        scale: 2.3
      }, 1500)
      .transition({
        opacity: 0
      }, 500, 'linear', function() {
        $(this)
          .css({
            diaplay   : 'none',
            transform : 'none',
            translate : 'none',
            x         : 0,
            y         : 0,
            scale     : 1
          });
        $(this).css({display: 'none'}); // it works, but its redundant 
        incrDomIndex();
        showPhoto();
      });
  };

photo_list是一个img dom的Array对象，每个都有一个类。

.photo {
  position : absolute;
  top      : 0;
  left     : 0;
  width    : 800px;
  height   : 500px;
}

Answer 1

 $(this)
      .css({
        diaplay   : 'none', // Mistake here
        transform : 'none',
        translate : 'none',
        x         : 0,
        y         : 0,
        scale     : 1
      });
    $(this).css({display: 'none'}); // it works, but its redundant 
    incrDomIndex();
    showPhoto();

将 diaplay 更改为显示，看看是否能为您修复这两个错误。

css＆＃39;不显示＆＃39;在第一次不起作用

1 个答案: