All you need is:
- any number of groups marked with a dynamic-stats class,
- element with dynamic-stats-switch class where the dropdown will be (any number),
- and then each stat as a single element with dynamic-stat class + data-base and data-level attributes (you guessed it! only 2).
| Example | Code |
|---|---|
Health
Mana
Attack speed
You can have as many as you want (for some reason) |
<div class="dynamic-stats" >
<div class="dynamic-stats-switch" data-prefix="Level:"></div>
Health
:Alistar: <span class="dynamic-stat" data-base="613.36" data-level="106">613.36 (+106)</span>
:Kalista: <span class="dynamic-stat" data-base="517.76" data-level="83">517.76 (+83)</span>
Mana
:Zoe: <span class="dynamic-stat" data-base="340" data-level="50">340 (+50)</span>
:Syndra: <span class="dynamic-stat" data-base="384" data-level="60">384 (+60)</span>
Attack speed
:TF: 0.651 (+<span class="dynamic-stat" data-base="0" data-level="3.22">0 (+3.22)</span>%)
:MF: 0.656 (+<span class="dynamic-stat" data-base="0" data-level="3">0 (+3)</span>%)
You <span class="dynamic-stats-switch"></span>
can <span class="dynamic-stats-switch"></span>
have <span class="dynamic-stats-switch"></span>
as <span class="dynamic-stats-switch"></span>
many <span class="dynamic-stats-switch"></span>
as <span class="dynamic-stats-switch"></span>
you <span class="dynamic-stats-switch"></span>
want <span class="dynamic-stats-switch"></span>
(for some reason)
</div>
|
| Default to 18th level and enable <small> around decimals. | |
Health
Mana
Attack speed
You can have as many as you want (for some reason) |
<div class="dynamic-stats" data-accented="true" data-default="18">
<div class="dynamic-stats-switch" data-prefix="Level:"></div>
Health
:Alistar: <span class="dynamic-stat" data-base="613.36" data-level="106">613.36 (+106)</span>
:Kalista: <span class="dynamic-stat" data-base="517.76" data-level="83">517.76 (+83)</span>
Mana
:Zoe: <span class="dynamic-stat" data-base="340" data-level="50">340 (+50)</span>
:Syndra: <span class="dynamic-stat" data-base="384" data-level="60">384 (+60)</span>
Attack speed
:TF: 0<small>.651</small> (+<span class="dynamic-stat" data-base="0" data-level="3.22">0 (+3.22)</span>%)
:MF: 0<small>.656</small> (+<span class="dynamic-stat" data-base="0" data-level="3">0 (+3)</span>%)
You <span class="dynamic-stats-switch"></span>
can <span class="dynamic-stats-switch"></span>
have <span class="dynamic-stats-switch"></span>
as <span class="dynamic-stats-switch"></span>
many <span class="dynamic-stats-switch"></span>
as <span class="dynamic-stats-switch"></span>
you <span class="dynamic-stats-switch"></span>
want <span class="dynamic-stats-switch"></span>
(for some reason)
</div>
|
| 30th level!1! | |
Health
Mana
Attack speed
You can have as many as you want (for some reason) |
<div class="dynamic-stats" data-default="30">
<div class="dynamic-stats-switch" data-prefix="Level:"></div>
Health
:Alistar: <span class="dynamic-stat" data-base="613.36" data-level="106">613.36 (+106)</span>
:Kalista: <span class="dynamic-stat" data-base="517.76" data-level="83">517.76 (+83)</span>
Mana
:Zoe: <span class="dynamic-stat" data-base="340" data-level="50">340 (+50)</span>
:Syndra: <span class="dynamic-stat" data-base="384" data-level="60">384 (+60)</span>
Attack speed
:TF: 0.651 (+<span class="dynamic-stat" data-base="0" data-level="3.22">0 (+3.22)</span>%)
:MF: 0.656 (+<span class="dynamic-stat" data-base="0" data-level="3">0 (+3)</span>%)
You <span class="dynamic-stats-switch"></span>
can <span class="dynamic-stats-switch"></span>
have <span class="dynamic-stats-switch"></span>
as <span class="dynamic-stats-switch"></span>
many <span class="dynamic-stats-switch"></span>
as <span class="dynamic-stats-switch"></span>
you <span class="dynamic-stats-switch"></span>
want <span class="dynamic-stats-switch"></span>
(for some reason)
</div>
|
Nested[]
Health
- Alistar: 613.36 (+106)
- Kalista: 517.76 (+83)
Mana
- Zoe: 340 (+50)
- Syndra: 384 (+60)
Attack speed
- TF: 0.651 (+0 (+3.22)%)
- MF: 0.656 (+0 (+3)%)
You can have as many as you want (for some reason)
Health
- Alistar: 613.36 (+106)
- Kalista: 517.76 (+83)
Mana
- Zoe: 340 (+50)
- Syndra: 384 (+60)
Attack speed
- TF: 0.651 (+0 (+3.22)%)
- MF: 0.656 (+0 (+3)%)
You can have as many as you want (for some reason)
Health
- Alistar: 613.36 (+106)
- Kalista: 517.76 (+83)
Mana
- Zoe: 340 (+50)
- Syndra: 384 (+60)
Attack speed
- TF: 0.651 (+0 (+3.22)%)
- MF: 0.656 (+0 (+3)%)
You can have as many as you want (for some reason)