Ionicon as a background loading image


#1

I want to use ionicon loading icon while the image loads. I want to use this when the image is set as a background-url as well as in an img tag. I have found this solution on stack overflow which works with fontAwesome, but i am not able to use it. This is what I have tried.

.loadingIcon :before {
position:absolute;
content: “\f28e”;
font-family:Ionicons;
top: 0;
left: -5px;

}

And I have applied class “loadingIcon” to the img tag.


#2

Because you cannot apply pseudo-elements to <img> tag

Specification

Note. This specification does not fully define the interaction of :before and :after with replaced elements (such as IMG in HTML). This will be defined in more detail in a future specification.