-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
108 lines (88 loc) · 5.05 KB
/
index.html
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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html>
<html>
<head>
<title>Suzanne - text replacer</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="scripts.js"></script>
</head>
<body>
<div id = 'left'>
<h2>Associative replacer</h2>
<p class = "expl">This is an associative text replacer, Hover over any noun to see the original<br>
On the right hand of this page is the resault of a manually performed "mashup" using the following technique:<ol>
<li>Choose randomly a noun in the song</li>
<li>Turn to the person next to you</li>
<li>Say the word to the person and wait for a replay</li>
<li>The word the person replyed is now replacing these nouns in the text</li>
<li>Repeat until song looses meaning</li>
</ol></p>
</div>
<div id = 'right'>
<h1> "Suzanne" </h1>
<p>
<span id = 'su'>Suzanne</span> takes <span class = 'you'>you</span> down to her <span id = 'place'>place</span> near the <span id = 'river'>river</span><br>
<span class = 'you'>You</span> can hear the <span id = 'boats'>boats</span> go by<br>
<span class = 'you'>You</span> can spend the <span id = 'night'>night</span> beside her<br>
And <span class = 'you'>you</span> know that <span id = 'she'> she's half crazy<br>
But that's why <span class = 'you'>you</span> want to be there <br>
And <span class = 'she'> she</span> feeds <span class = 'you'>you</span> <span id ='tea'>tea</span> and <span id = 'oranges'>oranges</span><br>
That come all the way from <span id ='china'>China</span> <br>
And just when <span class = 'you'>you</span> mean to tell her <br>
That <span class = 'you'>you</span> have no <span id ='love'>love</span> to give her <br>
Then <span class = 'she'> she</span> gets <span class = 'you'>you on her wavelength <br>
And <span class = 'she'> she</span> lets the <span class = 'river'>river</span> answer <br>
That <span class = 'you'>you</span>'ve always been her lover <br>
And <span class = 'you'>you</span> want to travel with her <br>
And <span class = 'you'>you</span> want to travel blind <br>
And <span class = 'you'>you</span> know that <span class = 'she'> she</span> will trust <span class = 'you'>you</span><br>
For <span class = 'you'>you</span>'ve touched her perfect <span class ='body'>body</span> with your <span class = 'mind'>mind</span>. <br>
And <sapn id = 'jesus'>Jesus</span> was a sailor <br>
When he walked upon the <span id = 'water'> water</span> <br>
And <span class = 'he'>he</span> spent a long time</span> watching <br>
From his lonely wooden <span id = 'tower'>tower</span> <br>
And when <span class = 'he'>he</span> knew for certain <br>
Only drowning men</span> could see him <br>
<span class = 'he'>He</span> said "All men</span> will be sailors then <br>
Until the <span id = 'sea'>sea</span> shall free them" <br>
But <span class = 'he'>he</span> himself was broken <br>
Long before the <span = id = 'sky'>sky</span> would open <br>
Forsaken, almost <span id = 'human'>human</span> <br>
<span class = 'he'>He</span> sank beneath your <span id = 'wisdon'>wisdom</span> like a <span = id = 'stone'> stone</span> <br>
And <span class = 'you'>you</span> want to travel with him <br>
And <span class = 'you'>you</span> want to travel blind <br>
And <span class = 'you'>you</span> think maybe <span class = 'you'>you</span>'ll trust him <br>
For <span class = 'he'>he</span>'s touched your perfect <span class ='body'>body</span> with his <span class = 'mind'>mind</span>. <br>
</p>
<!-- <p>
Now Suzanne</span> takes your hand</span>
And <span id = 'she'> she leads <span class = 'you'>you</span> to the <span class = 'river'>river</span>
<span id = 'she'> she is wearing rags</span> and feathers</span>
From Salvation Army</span> counters</span>
And the sun</span> pours down like honey</span>
On our lady</span> of the harbour</span>
And <span id = 'she'> she</span> shows <span class = 'you'>you</span> where to look
Among the garbage</span> and the flowers</span>
There are heroes</span> in the seaweed
There are children</span> in the morning</span>
They</span> are leaning out for <span id ='love'>love</span>
And they</span> will lean that way forever
While Suzanne</span> holds the mirror</span>
And <span class = 'you'>you</span> want to travel with her
And <span class = 'you'>you</span> want to travel blind
And <span class = 'you'>you</span> know that <span class = 'you'>you</span> can trust her
For <span id = 'she'> she's touched your perfect <span class ='body'>body</span> with her <span class = 'mind'>mind</span>.
</p>
<p>
Writers: Michael Zeissl, Randy Newman, Leonard Cohen
</p>
<p>
</span> - a person, place, or thing
pro</span> - replaces a </span>
verb - describes action or a state of being
adverb - modifies or describes a verb, an adjective / adverb
adjective - modifies (limits or describes) a </span> / pro</span>
</p> -->
</div>
</body>
</html>