vanilla-lettering-js/vanilla-lettering-js-test.html at main · wize-wiz/vanilla-lettering-js · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!DOCTYPE html>
<html>
<head>
    <title>Vanilla lettering test</title>
    <script src="./vanilla-lettering.js"></script>
    <style type="text/css">
        body > div {
            margin-bottom: 40px;
        }
    </style>
</head>
<body>

<div class="do-chars">
    <span class="letterchars">An impossible event is an event that is non existing. There is no possibility that it can happen. Hence the probability of occurrence is 0.</span>
</div>
<div class="do-words">
    <span class="letterwords">The simplest of competing theories be preferred to the more complex or that explanations of unknown phenomena be sought first in terms of known quantities.</span>
</div>
<div class="do-wordchars">
    <span class="letterwordchars">The simplest of competing theories be preferred to the more complex or that explanations of unknown phenomena be sought first in terms of known quantities.</span>
</div>
<div class="do-lines">
    <span class="letterlines">Every record has been destroyed or falsified, every book rewritten,<br/>every picture has been repainted, every statue and street building has been renamed,<br/>every date has been altered.<br/>And the process is continuing day by day and minute by minute.<br/>History has stopped.</span>
</div>
<div class="do-attribute-lines">
    <span data-lettering="lines">Every record has been destroyed or falsified, every book rewritten,<br/>every picture has been repainted, every statue and street building has been renamed,<br/>every date has been altered.<br/>And the process is continuing day by day and minute by minute.<br/>History has stopped.</span>
</div>

<script type="text/javascript">
    // $('.letterchars').lettering();
    document.Tools.lettering('.letterchars');

    //
    // $('.letterwords').lettering('words);
    document.Tools.lettering('.letterwords', 'words');

    //
    // $('.letterwords').lettering('words').children('span').lettering();
    document.Tools.lettering('.letterwordchars', 'wordchars');

    //
    // $('.letterlines').lettering('lines');
    document.Tools.lettering('.letterlines', 'lines');
</script>

</body>
</html>