# j-Avatar

> Az Avatar komponensnek regisztrálnia kell a saját témáját.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: hu
Content-SHA256: 424a0bb5e7f20fc6b34703ac05b4c28ba659585cca7393f2ba46bc501a8be29a
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

- Támogatja a témákat
- Ez a singleton
- A `react-user-avatar`-ből származó

__témák__:

Az Avatar komponensnek regisztrálnia kell a saját témáját. tartalmazza a `default` témát.

```javascript
SETTER(true, 'avatar', 'register', 'THEME_NAME', 'options')
```

Az opciók tartalmazhatnak:

- `size` {Number} Opcionális, pixelek méretű (default: `100`)
- `lighten` {Number} Opcionális, a betűtípus színe a háttérszín fényes tényezője által megvilágosodik (default: `80` | 255 és 255 között
- `radius` {Number} Opcionális, hogy a kerek sarok lesz (default: `50`)
- `background` {Hex} Opcionális, háttérszín (default: kiválasztott színekből `Array`)
- `color` {Hex} Opcionális, beállított betűtípus színe (meghatározott: a háttérszíntől származó fény)
- `font` {String} Opcionális, beállított betűtípus (default: `Arial`)
- `weight` {String} Opcionális, betűtípus (default: `bold`)
- `class` {String} Opcionális, ez a tulajdonság parfümök `toggleClass` erre az osztályra

__Használat__:

Az avatar minden eleme tartalmazza a `avatar` osztályot, mint ez: `<div class="avatar">`.

- `data-a="THEME_NAME"` Opcionális, tartalmazhat egy témakör nevét (default: `default`)
- `data-a-url="URL_TO_PICTURE"` Opcionális, tartalmazhat egy URL-t a felhasználói fotó
- `data-a-class="class_for_toggle_effect"` Opcionális, tartalmazhat egy osztály a `toggleClass` hatás

Az elemnek felhasználói nevet kell tartalmaznia, például:

- `<div class="avatar">Peter Širka</div>` vagy
- `<a href="#" class="avatar">Peter Širka</a>`

__Jó tudni__:

- Az avatar komponens automatikusan összeköti az összes új avatárt
- A `SETTER('avatar', 'refresh')` frissítést nyújt

Használja a `<ui-component name="avatar">`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 CDN default). szerző: Denis Granec. forrás: a Componentator Az összetevők raktár, MIT licenc.

```html example.html
<ui-component name="avatar"></ui-component>

<a href="https://www.totaljs.com" class="avatar hidden" data-a-class="hidden" data-a-url="https://scontent.fbts5-1.fna.fbcdn.net/v/t1.0-9/12552918_10209045123711641_5810437084053575333_n.jpg?oh=f0d9f5acdbab2f1f2cf165bf9aed8da5&oe=5A3F378D">Peter Širka</a>
<div class="avatar hidden" data-a-class="hidden">Martin Smola</div>
<div class="avatar hidden" data-a-class="hidden" data-a-url="https://avatars3.githubusercontent.com/u/7585285?v=4&s=460">Denis Granec</div>
<div class="avatar hidden" data-a-class="hidden">Denis Oliver</div>
<div class="avatar hidden" data-a="black">Kristle Leverone</div>
<div class="avatar hidden" data-a="black">Denis</div>
<div class="avatar hidden" data-a="black">Peter</div>

<script>
	// Registers a new theme
	SETTER(true, 'avatar/register', 'black', 'background:black;color:white;class:hidden');
</script>
```