search

luis-almeida / unveil

A very lightweight jQuery plugin to lazy load images
4.15k stars 675 forks source link

Lazy Load responsive background images? #96

Open csdougliss opened 9 years ago

csdougliss commented 9 years ago

I've been using unveil for a while and I was searching for something that does BG images. I found lazysizes, bgset and respimg.js and they do what I want but in total we are looking at 11.5 KB.

I like unveil's small size, so would it be possible with unveil?

html is like so:

<div class="category-top-banner lazyload" data-bgset="' . $this->getSmallImageUrl() . ' [(max-width: 650px)] | ' . $this->getLargeImageUrl() . '"' : ""; ?>>
</div>
timbunch commented 9 years ago

It wouldn't support it currently. However, I imagine it could be modified to do so.

pau1phi11ips commented 8 years ago

I wanted it to do this too. I made a small change to check if it's acting on a img tag (then set src) or acting on something else then set the background-image to the data-src value https://github.com/pau1phi11ips/unveil/blob/master/jquery.unveil.js

lynnic26 commented 8 years ago

I need this feature too.

thewarpaint commented 8 years ago

@pau1phi11ips Thanks! You might want to push the new 1.3.1 tag to your repo so that it can be installed by doing $ bower install pau1phi11ips/unveil, otherwise you need to add a git ref.

1-800-jono commented 7 years ago

How would use this? Like this?

$(function() { $("div.Bg-img-clas").unveil(300); });