30 lines
1 KiB
HTML
30 lines
1 KiB
HTML
<h2>Add text or remove text from div (max and min font size)</h2>
|
|
<div style="border: 2px solid; overflow:hidden; width:100%; height:300px; font-size:520px;">
|
|
<div [fittext]="true"
|
|
[modelToWatch]="title"
|
|
[maxFontSize]="50"
|
|
[minFontSize]="30"
|
|
[activateOnResize]="true">{{title}}</div>
|
|
</div>
|
|
|
|
|
|
<h2>Add text or remove text from div (no max and no min font size)</h2>
|
|
<div style="border: 2px solid; overflow:hidden; width:100%; height:300px; font-size:520px;">
|
|
<div [fittext]="true"
|
|
[modelToWatch]="title"
|
|
[activateOnResize]="true">{{title}}</div>
|
|
</div>
|
|
|
|
<button (click)="click('add')"> ADD text</button>
|
|
<button (click)="click('remove')"> REMOVE text</button>
|
|
|
|
<br/>
|
|
<br/>
|
|
<h2>Write text in input box (text fit inside without overflowing)</h2>
|
|
<div #cont2 style="border: 2px solid; height:101px; width:300px;">
|
|
<input [fittext]="true"
|
|
style="width:100%; height:100px"
|
|
[activateOnResize]="true"
|
|
[activateOnInputEvents]="true"
|
|
[container]="cont2">
|
|
</div>
|