June 5, 2016
Preloading Images with Cross Browser Opacity
A simple SCSS mixin here for setting the opacity on preload to 0, and when the image is loaded to a value of your choice (in this example its 90%, use 1 as your value for 100%)
@mixin opacity($opacity) {
opacity: $opacity;
$opacity-ie: $opacity * 100;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity="+$opacity-ie+")";
filter: alpha(opacity=$opacity-ie); }
Usage
img.preload{
@include Opacity(0);
&.complete{
Read more [...]
