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.

  1. is idea anyway?
  2. 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

Popular posts from this blog

twig - Using Twigbridge in a Laravel 5.1 Package -

jdbc - Not able to establish database connection in eclipse -

Kivy: Swiping (Carousel & ScreenManager) -