j-SVGIcons

jComponent 20 · jcomponent@20 component Príklad načítaný s jComponent 20

Tento komponent registruje nový webový komponent v tvare <ui-svgicon name="icon_name"></ui-svgicon>.

Použite generátor spritov SVG https://svgsprit.es/

Konfigurácia:

url {String} URL adresa súboru SVG (predvolené: empty)
size {Number} predvolená šírka obrázka (predvolená: empty)

Atribúty <ui-svgicon>:

name {String} voliteľné, názov ikony
size {Number} voliteľné, veľkosť obrázka (predvolené: config.size)
selected {String} voliteľný, vybraný názov ikony (zobrazí sa, ak nadradený prvok bude obsahovať triedu .selected)

Použite ho so <ui-component name="svgicons">. Keď komponent ešte nie je načítaný, jComponent ho stiahne pri prvom použití z adresy v DEF.fallback (predvolene CDN Componentator). Autor: Peter Širka. Zdroj: úložisko komponentov Componentator, licencia MIT.

example.html

<ui-component name="svgicons" config="url:/svgicons.svg;size:30"></ui-component>

<div class="padding">
	<ui-svgicon name="phone"></ui-svgicon>
	<ui-svgicon name="phone"></ui-svgicon>
	<ui-svgicon name="phone" size="50"></ui-svgicon>
	<span class="toggle">
		<ui-svgicon name="profile" selected="profilefull"></ui-svgicon>
	</span>
</div>

<script>

	setInterval(function() {
		$('.toggle').tclass('selected');
	}, 1500);

</script>