html - Inline/Encoded SVGs as Lazyload placeholder -
i'm using lazyloader replace <img>
placeholder real image via javascript.
using placeholder image on responsive sites (overriding width
, height
attributes via css) results in content jumps, when real image different proportion has been loaded. plan insert simple inline svg code dimensions of final image.
- is idea anyway?
- how cope
<img>
vs<svg>
tag? (needed preloader placeholder)
[edit clearer instruction – @robert longson]
appelsiini.net lazyload
$("img.lazy").lazyload({ effect : "fadein", placeholder : "" // null or free //placeholder : "loading.gif" }); img.loading { background: transparent url(../image/load.gif) no-repeat center center; } <img class="lazy loading" ... />
Comments
Post a Comment