j-LazyLoad

jComponent 20 · jcomponent@20 component Példa betöltve a jComponent 20-szal

Mindenre használható
Csak függőleges helyzetben

konfiguráció:

container {String} egy kiválasztó, mint egy szeletelő tartály (default: window)
selector {String} (jelentős) szelektív elemekhez
exec {String} a módszerhez való link, amely akkor fut, ha a lágy elem látható
offset {Number} Ez az érték kiterjeszti a forgatási terület méretét felső/alacsonyra. (default: 50)

módszerek:

instance.refresh() frissíti a jelenlegi állapot

Használja a <ui-component name="lazyload">Amennyiben a készülék még nem tölthető le, jComponent letöltés az első felhasználásra a címről DEF.fallback (Azt a Componentator A szerző: Peter Širka. forrás: a Componentator Az összetevők raktár, MIT licenc.

example.html

<ui-component name="lazyload" config="selector:.lazyload;exec:lazyload" style="height:1000px">
	<div>SCROLL DOWN</div>
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<div class="lazyload"><img src="https://componentator.com/img/preloader.gif" data-src="https://componentator.com/img/logo.png" /></div>
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
	<br />
</ui-component>

<script>
	function lazyload(el) {
		var img = el.find('img');
		img.attr('src', img.attr('data-src'));
	}
</script>