angular-images-loaded
Version:
Super simple Angular directive to wrap imagesLoaded plugin
38 lines (34 loc) • 782 B
CSS
body {
margin: 0;
padding: 0;
}
.wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
padding: 100px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: scale(0.1) rotate(360deg);
-moz-transform: scale(0.1) rotate(360deg);
transform: scale(0.1) rotate(360deg);
-webkit-transition: all 1000ms 500ms cubic-bezier(0.86, 0, 0.07, 1);
-moz-transition: all 1000ms 500ms cubic-bezier(0.86, 0, 0.07, 1);
transition: all 1000ms 500ms cubic-bezier(0.86, 0, 0.07, 1);
}
.wrapper.images-loaded {
opacity: 0;
}
.wrapper.loaded {
-webkit-transform: scale(1);
-moz-transform: scale(1);
transform: scale(1);
}
img {
max-width: 100%;
max-height: 100%;
}