shrimpwagon / jquery-lazyloadanything

Lazy load (trigger events) when elements come into view
45 stars 14 forks source link

Working Example of Anything and Not Just Images #8

Open wpfixit opened 2 years ago

wpfixit commented 2 years ago

The example you have here below is for images which is already widely used in LazyLoad.

Can you provide an example of any HTML element using LazyLoad? For example to LazyLoad a DIV with the class "lazy_me"?

$('img').lazyloadanything({ 'onLoad': function(e, LLobj) { var $img = LLobj.$element; var src = $img.attr('data-src'); $img.attr('src', src); } });

shrimpwagon commented 2 years ago

Haha, hey! I didn't think anyone was even using this....

So provide an example that doesn't have to do with images?

Sure np. I mean... all you do is just change the jquery selector

$('#some-element').lazyloadanything();
wpfixit commented 2 years ago

Yes! Would be great to see an example that is not an image but a DIV of content.

shrimpwagon commented 2 years ago

Do yall actually use it? I haven't touched this repo in years. Or did you just want to use it and curious?

wpfixit commented 2 years ago

Of course I want to use it or I would not waste your time asking.

shrimpwagon commented 2 years ago

Hah, np! I'm glad to! Uh... give me a few mins today. I'll see what I can do.

wpfixit commented 2 years ago

Sweetness. Will buy you a couple beers if this will work to LazyLoad any DIV by class.

shrimpwagon commented 2 years ago

Updated! I also added a funding page.

Do my a favor. Let me know how it works for newest Jquery version.

In theory should work find as this code is fairly simple.

Thank you!

shrimpwagon commented 2 years ago

ok try now. I fixed the funding page too.

shrimpwagon commented 2 years ago

If you are interested I have a Docker Laravel turn-key dev stack:

https://github.com/CaneBayComputers/cbc-laravel

You can set up a bunch of websites easy.

wpfixit commented 2 years ago

I am sorry but I do not know what any of this means. How can I find a working example where a DIV can be Lazy Loaded by class?

shrimpwagon commented 2 years ago

You don't lazy load a div per se. In your HTML there would already be an element. When the element comes into the viewport it then triggers the lazy load. So, if you wanted to load a div another element that shows up in the viewport would have to trigger it. So maybe something like this.....

You would have these elements already in the HTML:

<div class="triggering-element"></div>
$('.triggering-element').lazyloadanything({
    'onLoad': function(e, LLobj) {
        LLobj.$element.css('background-color', 'red');
});
wpfixit commented 2 years ago

Thanks but how would something like this be implemented on a web page. A working example would be AMAZING!!!!

shrimpwagon commented 2 years ago

Yo... you gonna have to figure that out for yourself.

On Fri, Jun 17, 2022 at 12:19 PM WP Fix It @.***> wrote:

Thanks but how would something like this be implemented on a web page. A working example would be AMAZING!!!!

— Reply to this email directly, view it on GitHub https://github.com/shrimpwagon/jquery-lazyloadanything/issues/8#issuecomment-1159034063, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAYWLHXDHI5B7TC5W6WW53VPSQQTANCNFSM5Y7KFCMA . You are receiving this because you commented.Message ID: @.***>

-- Shawn M Welch Artisan Computer Programmer

"...for the Lord seeth not as man seeth, for man looketh on the outward appearance, but the Lord looketh on the heart. " - 1 Samuel 16:7