lojk-ui/src/components/lotusPreViewer/lotusPreviewer.less

lojk vue ui components library

@import (reference) "../../style/config";

@register: lotus-previewer;
.@{register} {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 1);
  .flex();
  .flex-hvc();
  z-index: 100;
  img {
    width: 100%;
    transform:scale(0);
    transform-origin: 50% 50%;
  }
  img.act{
    animation:add .24s forwards;
  }
  //图片变大
  @keyframes add{
    0%{
      transform:scale(0);
    }
    100%{
      transform:scale(1);
    }
  }
  img.remove{
    animation:remove .24s;
  }
  //图片变大
  @keyframes remove{
    0%{
      transform:scale(1);
    }
    100%{
      transform:scale(0);
    }
  }
}