InuunaPlayby/index.html at main · Zepheli/InuunaPlayby · 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
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
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fredericka+the+Great&family=Sail&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Lobster&family=Rubik+Moonrocks&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Grenze+Gotisch&family=Tapestry&display=swap" rel="stylesheet">


<body style="background-image:url('https://cdn.wallpapersafari.com/76/91/cMZupT.jpg'); background-repeat: no-repeat; background-size: cover !important; margin:0;">

<img id="pic" align=right src=https://i.postimg.cc/Z5gxMW3j/Inu-old.png width=auto height=100% style="margin-right:-200px;transition: 5s;">
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

<center>
<div style="background-color:#d9b3ff; border-style: double; border-color: #6600cc;">
<font class="name" color="#6600cc" style="font-family: 'Grenze Gotisch', cursive;font-size:80px;"><b>Inuuna Nekosaru</b></font>
 <br>
 <hr>

<br>
 <button class="round" id="prev" onclick="btnPrev()" style="float:left;">&#8249;</button>
  <button class="round" id="next" onclick="btnNext()" style="float:right;">&#8250;</button>
  <div class="textblock">
<font id="first" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
The young Felinae has lived as a part of a travelling caravan of tradesmen who has found her on their route, and decided to take her in.They taught her the tricks of the merchant trade starting from a young age.
 </font>

<font id="2nd" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
She always felt quite different from the rest of the kids in the caravan seeing that she was the only Felinae in between them, however the chief of the caravan always took special interest in her.
 </font>

<font id="3rd" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
when she turned 15 he ordered all the merchants who were sent out making deals to bring her along for the negotiations and show her the art of it.She would often get in trouble because she tends to just say whatever is on her mind, she later managed to avoid doing that when doing business but in her everyday life it is still present today.
 </font>

<font id="4th" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
By the age of 18 she would be assigned her own route and clients, she would often get scolded for spending too much of her time at smokey inns after deals before returning to the others in the caravan developing quite a taste for ale.
 </font>

<font id="5th" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
When she was 25 the chief would call all their traders back for a meeting where he would tell them that a grand order has been made and they have to depart post-haste, and they did so.They prepared all their wares and their tents to take on the road.
 </font>

<font id="6th" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
 After ten days of travelling she would sense that something is not allright, she would feel somebody following them.By the time the night fell a group of bandits have ambushed their caravan, they were not fighters at all so the ambush turned quite chaotic, and in the disorder everybody would try to scatter and run.
 </font>

 <font id="7th" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
She ran too but in the heat of the escape she tripped over a rock and lost conciousness, she would later wake up in the woods alone with little memory of what happened. She tried to go look for her family and friends but all she found was what was left of their wares and homes seeing that they were robbed.
 </font>

 <font id="8th" color="#6600cc" face='verdana' size='3'style="font-weight: 900;">
After a couple hours of looking for survivors she would then realised she is going to have to try and fend for herself from now on.she met a friendly hunter near the edge of the woods who would take pitty on her and give her some contracts for hunting.When she part ways with the hunter she decided to look for the waystone inn he told her about saying if she'd tell the keep that he sent her they would help her and so they did.
She spent her days fishing and panhandling until she would save up enough coins to pay for her room and set up shop in the Osronan market to sell her wares as it being the only thing she really knew about.
 </font>
 </div>
<br>
</div>
</center>


<iframe width=0 height=0 src=https://www.youtube.com/embed/TYqjn7vdzOY?autoplay=1 title=YouTube video player frameborder=0 allow=accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture allowfullscreen></iframe>


<script>

$(document).ready(function(){
 //$('img').fadeout();
 $('img').hide();
$('img').fadeIn(3000);
$('font').hide();
//$('font').fadeTo(3000, 1.0);


});

</script>


<script>
let textId = "#first"
$(document).ready(function(){
$('#prev').css("visibility","hidden");
 //$('img').fadeout();
 /*$('img').hide();
$('img').fadeIn(3000);
$('font').hide();
$('font').fadeTo(3000, 1.0);*/
$('#pic').hide();
$('font').hide();
$('#pic').animate({"margin-right": '+=200'}, 1000);
$('#pic').fadeTo(3000, 1.0);
/*$('#blood').animate({"margin-right": '+=300'}, 1000);
$('#blood').fadeTo(3000, 1.0);*/
$('.name').fadeTo(3000, 1.0);
$(textId).fadeTo(3000, 1.0);


});

function btnNext(){

switch (textId) {
  case "#first":
   $('#next').css("visibility","visible");
   $('#prev').css("visibility","visible");
    $(textId).hide();
	textId = "#2nd";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#2nd":

    $(textId).hide();
	textId = "#3rd";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#3rd":
    $(textId).hide();
	textId = "#4th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#4th":
    $(textId).hide();
	textId = "#5th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#5th":
    $(textId).hide();
	textId = "#6th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#6th":
    $(textId).hide();
	textId = "#7th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#7th":
  $('#next').css("visibility","hidden");
   $('#prev').css("visibility","visible");
    $(textId).hide();
	textId = "#8th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#8th":
   $('#next').css("visibility","hidden");
   $('#prev').css("visibility","visible");

    break;
}


}

function btnPrev(){

switch (textId) {
  case "#first":
  $('#next').css("visibility","visible");
   $('#prev').css("visibility","hidden");
    $(textId).hide();
    break;
  case "#2nd":
   $('#next').css("visibility","visible");
   $('#prev').css("visibility","hidden");
    $(textId).hide();
	textId = "#first";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#3rd":
    $(textId).hide();
	textId = "#2nd";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#4th":
    $(textId).hide();
	textId = "#3rd";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#5th":
    $(textId).hide();
	textId = "#4th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#6th":
    $(textId).hide();
	textId = "#5th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#7th":
    $(textId).hide();
	textId = "#6th";
	$(textId).fadeTo(3000, 1.0);
    break;
  case "#8th":
  $('#next').css("visibility","visible");
  $('#prev').css("visibility","visible");
    $(textId).hide();
	textId = "#7th";
	$(textId).fadeTo(3000, 1.0);

    break;
}


}

</script>


<style>

#prev {
  background-color: #3385ff;
  color: white;
}

#next {
  background-color: #3385ff;
  color: white;

}


.round {
  border-radius: 50%;
  font-size: 16px;
  width: 40px;
  height: 40px;
}


}

</style>