You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
tl-dr/test-page-ereader.html

685 lines
39 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Scrollers!</title>
<style>
body {
font-family: sans-serif;
line-height: 1.5;
}
article {
max-width: 800px;
margin: 2rem auto;
}
blockquote {
font-style: italic;
text-align: left;
white-space: pre-wrap;
}
section {
padding: .5rem;
max-width: 1200px;
margin: 0 auto;
}
.info {
background-color: blue;
border: 5px dashed orange;
}
.corporate {
display: flex;
gap: 1rem;
list-style: none;
padding: 0 0;
margin: 0 0;
}
.corporate li {
background-color: orange;
width: 100px;
height: 100px;
border-radius: 4px;
display: flex;
justify-content: center;
align-items: center;
}
article p:nth-of-type(1)::first-letter {
initial-letter: 8;
margin: 0 1rem 1rem 0;
font-family: serif;
}
nav,
footer {
position: fixed;
top: 0;
width: 100%;
background: white;
border: 2px solid black;
z-index: 1;
left: 0;
padding: .5rem;
transform: translate3d(0, -100%, 0);
transition: .2s linear;
}
nav.visible {
transform: translate3d(0, 0, 0);
}
footer {
top: auto;
bottom: 0;
transform: none;
}
</style>
</head>
<body>
<section class="info">
<h1>This is a small test page to test the behaviour of scrollers on an e-reader</h1>
<p> style="color: red"That's why this page is incredibly long! As I know the person testing this page is a fan,
please enjoy a copy of a hitchhikers guide to the galaxy (Chapter 1)</p>
<p>Also, what color is this section, and my borders?</p>
</section>
<section>
<p>Here are some more color tests:</p>
<ul>
<li style="color: red">My text is red</li>
<li style="color: orange">My text is orange</li>
<li style="color: green">My text is green</li>
<li style="color: blue">My text is blue</li>
<li style="color: purple">My text is purple</li>
</ul>
<p>With some gray scales</p>
<ul>
<li style="color: grey">My text is grey</li>
<li style="color: darkgrey">My text is darkgrey</li>
<li style="color: lightgrey">My text is lightgrey</li>
<li style="color: white">My text is white</li>
<li style="color: gainsboro">My text is gainsboro</li>
</ul>
<p>And various level of opacity</p>
<ul>
<li style="opacity: 1">My text is 1.0 opacity</li>
<li style="opacity: .8">My text is .8 opacity</li>
<li style="opacity: .6">My text is .6 opacity</li>
<li style="opacity: .4">My text is .4 opacity</li>
<li style="opacity: .2">My text is .2 opacity</li>
</ul>
<p>My text can contain <a href="xpub.nl">Links</a>, and some <i>italic</i> or even <mark>highlighted</mark>,
<b>bold</b> and <code>code</code>'ed words!
</p>
<p>If i want to display footnotes this can be done with <sup>sup's</sup> or <sub>sub's</sub></p>
<p>And what about some fancy corporate borders???</p>
<ul class="corporate">
<li>Border</li>
<li style="border-radius: 10px">Border</li>
<li style="border-radius: 20px">Border</li>
<li style="border-radius: 50px">Border</li>
</ul>
<p>And corporate shadows??</p>
<ul class="corporate">
<li style=" box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);">Border</li>
<li style="box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);">Border</li>
<li style="box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);">Border</li>
</ul>
</section>
<section>
<h2>Scrolllllers</h2>
<p>I hope you'll see a normal scrollbar on the right. I suspect this is the browsers default scrollbar. Below,
you'll find some input with the type of range, and i wonder if you'll be able to drag 'm around</p>
<div>
<input class='fn-range' type="range" id="volume" name="volume" min="0" max="100" />
<label for="volume">Volume</label>
</div>
<pre class="fn-range-value"></pre>
<div>
<input type="range" id="cowbell" name="cowbell" min="0" max="100" value="90" step="10" />
<label for="cowbell">Cowbell</label>
</div>
</section>
<article>
<h1 id="the-hitchhiker-s-guide-to-the-galaxy">The Hitchhiker&#39;s Guide to the Galaxy</h1>
<h5>Douglas Adams</h5>
<blockquote>for
Jonny Brock and Clare Gorst
and all other Arlingtonians
for tea, sympathy, and a sofa</blockquote>
<p>Far out in the uncharted backwaters of the unfashionable end of the western spiral arm of the Galaxy lies a
small
unregarded yellow sun.</p>
<p>Orbiting this at a distance of roughly ninety-two million miles is an utterly insignificant little blue green
planet
whose ape-descended life forms are so amazingly primitive that they still think digital watches are a pretty
neat
idea.</p>
<p>This planet has - or rather had - a problem, which was this: most of the people on it were unhappy for pretty
much of
the time. Many solutions were suggested for this problem, but most of these were largely concerned with the
movements of small green pieces of paper, which is odd because on the whole it wasn&#39;t the small green
pieces of
paper that were unhappy.</p>
<p>And so the problem remained; lots of the people were mean, and most of them were miserable, even the ones
with
digital watches.</p>
<p> Many were increasingly of the opinion that they&#39;d all made a big mistake in coming down from the trees
in the
first place. And some said that even the trees had been a bad move, and that no one should ever have left
the
oceans.</p>
<p> And then, one Thursday, nearly two thousand years after one man had been nailed to a tree for saying how
great it
would be to be nice to people for a change, one girl sitting on her own in a small cafe in Rickmansworth
suddenly
realized what it was that had been going wrong all this time, and she finally knew how the world could be
made a
good and happy place. This time it was right, it would work, and no one would have to get nailed to
anything.</p>
<p> Sadly, however, before she could get to a phone to tell anyone about it, a terribly stupid catastrophe
occ style="color: red"urred, and
the idea was lost forever.</p>
<p> This is not her story.</p>
<p> But it is the story of that terrible stupid catastrophe and some of its consequences.</p>
<p> It is also the story of a book, a book called The Hitch Hiker&#39;s Guide to the Galaxy - not an Earth book,
never
pub style="color: red"lished on Earth, and until the terrible catastrophe occurred, never seen or heard of
by any Earthman.</p>
<p> Nevertheless, a wholly remarkable book.</p>
<p> in fact it was probably the most remarkable book ever to come out of the great publishing houses of Ursa
Minor - of
which no Earthman had ever heard either.</p>
<p> Not only is it a wholly remarkable book, it is also a highly successful one - more popular than the
Celestial Home
Care Omnibus, better selling than Fifty More Things to do in Zero Gravity, and more controversial than Oolon
Colluphid&#39;s trilogy of philosophical blockbusters Where God Went Wrong, Some More of God&#39;s Greatest
Mistakes
and Who is this God Person Anyway? In many of the more relaxed civilizations on the Outer Eastern Rim of the
Galaxy,
the Hitch Hiker&#39;s Guide has already supplanted the great Encyclopedia Galactica as the standard
repository of
all knowledge</p>
<p>and wisdom, for though it has many omissions and contains much that is apocryphal, or at least wildly
inaccurate, it
scores over the older, more pedestrian work in two important respects.</p>
<p> First, it is slightly cheaper; and secondly it has the words Don&#39;t Panic inscribed in large friendly
letters on
its cover.</p>
<p> But the story of this terrible, stupid Thursday, the story of its extraordinary consequences, and the story
of how
these consequences are inextricably intertwined with this remarkable book begins very simply.</p>
<p> It begins with a house.</p>
<h2>Chapter 1</h2>
<p>The house stood on a slight rise just on the edge of the village. It stood on its own and looked over a broad
spread
of West Country farmland. Not a remarkable house by any means - it was about thirty years old, squattish,
squarish,
made of brick, and had four windows set in the front of a size and proportion which more or less exactly
failed to
please the eye.</p>
<p> The only person for whom the house was in any way special was Arthur Dent, and that was only because it
happened to
be the one he lived in. He had lived in it for about three years, ever since he had moved out of London
because it
mad style="color: red"e him nervous and irritable. He was about thirty as well, dark haired and never quite
at ease with
himself. The
thing that used to worry him most was the fact that people always used to ask him what he was looking so
worried
about. He worked in local radio which he always used to tell his friends was a lot more interesting than
they
probably thought. It was, too - most of his friends worked in advertising.</p>
<p> style="color: red" It hadn&#39;t properly registered with Arthur that the council wanted to knock down his
house and build an
bypass
instead.</p>
<p> At eight o&#39;clock on Thursday morning Arthur didn&#39;t feel very good. He woke up blearily, got up,
wan style="color: red"dered
blearily round his room, opened a window, saw a bulldozer, found his slippers, and stomped off to the
bathroom to
wash.</p>
<p> Toothpaste on the brush - so. Scrub.</p>
<p> Shaving mirror - pointing at the ceiling. He adjusted it. For a moment it reflected a second bulldozer
through the
bathroom window. Properly adjusted, it reflected Arthur Dent&#39;s bristles. He shaved them off, washed,
dried, and
stomped off to the kitchen to find something pleasant to put in his mouth.</p>
<p> Kettle, plug, fridge, milk, coffee. Yawn.</p>
<p> style="color: red" The word bulldozer wandered through his mind for a moment in search of something to
connect with.</p>
<p> The bulldozer outside the kitchen window was quite a big one.</p>
<p> style="color: red" He stared at it.</p>
<p> &quot;Yellow,&quot; he thought and stomped off back to his bedroom to get dressed.</p>
<p> Passing the bathroom he stopped to drink a large glass of water, and another. He began to suspect that he
was hung
over. Why was he hung over? Had he been drinking the night before? He supposed that he must have been. He
caught a
glint in the shaving mirror. &quot;Yellow,&quot; he thought and stomped on to the bedroom.</p>
<p> style="color: red" He stood and thought. The pub, he thought. Oh dear, the pub. He vaguely remembered being
angry, angry about
something that seemed important. He&#39;d been telling people about it, telling people about it at great
length, he
rather suspected: his clearest visual recollection was of glazed looks on other people&#39;s faces.</p>
<p> Something about a new bypass he had just found out about. It had been in the pipeline for months only no one
seemed
to have known about it. Ridiculous. He took a swig of water. It would sort itself out, he&#39;d decided, no
one
wanted a bypass, the council didn&#39;t have a leg to stand on. It would sort itself out.</p>
<p>God what a terrible hangover it had earned him though. He looked at himself in the wardrobe mirror.</p>
<p> style="color: red" He stuck out his tongue. &quot;Yellow,&quot; he thought. The word yellow wandered through
his mind in search
of
something to connect with.</p>
<p> Fifteen seconds later he was out of the house and lying in front of a big yellow bulldozer that was
advancing up his
garden path.</p>
<p> Mr L Prosser was, as they say, only human. In other words he was a carbon-based life form descended from an
ape.
More specifically he was forty, fat and shabby and worked for the local council. Curiously enough, though he
didn&#39;t know it, he was also a direct male-line descendant of Genghis Khan, though intervening
generations and
racial mixing had so juggled his genes that he had no discernible Mongoloid characteristics, and the only
vestiges
lef style="color: red"t in Mr L Prosser of his mighty ancestry were a pronounced stoutness about the tum and
a predilection for
little
fur hats.</p>
<p> He was by no means a great warrior: in fact he was a nervous worried man. Today he was particularly nervous
and
worried because something had gone seriously wrong with his job - which was to see that Arthur Dent&#39;s
house got
cle style="color: red"ared out of the way before the day was out.</p>
<p> &quot;Come off it, Mr Dent,&quot;, he said, &quot;you can&#39;t win you know. You can&#39;t lie in front of
the
bulldozer indefinitely.&quot; He tried to make his eyes blaze fiercely but they just wouldn&#39;t do it.</p>
<p> Arthur lay in the mud and squelched at him.</p>
<p> &quot;I&#39;m game,&quot; he said, &quot;we&#39;ll see who rusts first.&quot; &quot;I&#39;m afraid
you&#39;re going
to have to accept it,&quot; said Mr Prosser gripping his fur hat and rolling it round the top of his head,
&quot;this bypass has got to be built and it&#39;s going to be built!&quot; &quot;First I&#39;ve heard of
it,&quot;
said Arthur, &quot;why&#39;s it going to be built?&quot; Mr Prosser shook his finger at him for a bit, then
stopped
and put it away again.</p>
<p> &quot;What do you mean, why&#39;s it got to be built?&quot; he said. &quot;It&#39;s a bypass. You&#39;ve got
to
build bypasses.&quot; Bypasses are devices which allow some people to drive from point A to point B very
fast whilst
other people dash from point B to point A very fast. People living at point C, being a point directly in
between,
are often given to wonder what&#39;s so great about point A that so many people of point B are so keen to
get there,
and what&#39;s so great about point B that so many people of point A are so keen to get there.</p>
<p> They often wish that people would just once and for all work out where the hell they wanted to be.</p>
<p> Mr Prosser wanted to be at point D. Point D wasn&#39;t anywhere in particular, it was just any convenient
point a
very long way from points A, B and C. He would have a nice little cottage at point D, with axes over the
door, and
spend a pleasant amount of time at point E, which would be the nearest pub to point D. His wife of course
wanted
climbing roses, but he wanted axes. He didn&#39;t know why - he just liked axes. He flushed hotly under the
derisive
grins of the bulldozer drivers.</p>
<p> He shifted his weight from foot to foot, but it was equally uncomfortable on each. Obviously somebody had
been
appallingly incompetent and he hoped to God it wasn&#39;t him.</p>
<p> Mr Prosser said: &quot;You were quite entitled to make any suggestions or protests at the appropriate time
you
know.&quot; &quot;Appropriate time?&quot; hooted Arthur. &quot;Appropriate time? The first I knew about it
was when
a workman arrived at my home yesterday. I asked him if he&#39;d come to clean the windows and he said no
he&#39;d
come to demolish the house. He didn&#39;t tell me straight away of course. Oh no. First he wiped a couple of
windows
and charged me a fiver. Then he told me.&quot; &quot;But Mr Dent, the plans have been available in the local
planning office for the last nine month.&quot; &quot;Oh yes, well as soon as I heard I went straight round
to see
them, yesterday afternoon. You hadn&#39;t exactly gone out of your way to call attention to them had you? I
mean
like actually telling anybody or anything.&quot; &quot;But the plans were on display ...&quot; &quot;On
display? I
eventually had to go down to the cellar to find them.&quot; &quot;That&#39;s the display department.&quot;
&quot;With a torch.&quot;</p>
<p>&quot;Ah, well the lights had probably gone.&quot; &quot;So had the stairs.&quot; &quot;But look, you found
the
notice didn&#39;t you?&quot; &quot;Yes,&quot; said Arthur, &quot;yes I did. It was on display in the bottom
of a
locked filing cabinet stuck in a disused lavatory with a sign on the door saying Beware of the
Leopard.&quot; A
cloud passed overhead. It cast a shadow over Arthur Dent as he lay propped up on his elbow in the cold mud.
It cast
a shadow over Arthur Dent&#39;s house. Mr Prosser frowned at it.</p>
<p> &quot;It&#39;s not as if it&#39;s a particularly nice house,&quot; he said.</p>
<p> &quot;I&#39;m sorry, but I happen to like it.&quot; &quot;You&#39;ll like the bypass.&quot; &quot;Oh shut
up,&quot;
said Arthur Dent. &quot;Shut up and go away, and take your bloody bypass with you. You haven&#39;t got a leg
to
stand on and you know it.&quot; Mr Prosser&#39;s mouth opened and closed a couple of times while his mind
was for a
moment filled with inexplicable but terribly attractive visions of Arthur Dent&#39;s house being consumed
with fire
and Arthur himself running screaming from the blazing ruin with at least three hefty spears protruding from
his
back.</p>
<p> style="color: red" Mr Prosser was often bothered with visions like these and they made him feel very
nervous. He stuttered for
a moment
and then pulled himself together.</p>
<p> &quot;Mr Dent,&quot; he said.</p>
<p> &quot;Hello? Yes?&quot; said Arthur.</p>
<p> &quot;Some factual information for you. Have you any idea how much damage that bulldozer would suffer if I
just let
it roll straight over you?&quot; &quot;How much?&quot; said Arthur.</p>
<p> &quot;None at all,&quot; said Mr Prosser, and stormed nervously off wondering why his brain was filled with
a
thousand hairy horsemen all shouting at him.</p>
<p> By a curious coincidence, None at all is exactly how much suspicion the ape-descendant Arthur Dent had that
one of
his closest friends was not descended from an ape, but was in fact from a small planet in the vicinity of
Betelgeuse
and not from Guildford as he usually claimed.</p>
<p> Arthur Dent had never, ever suspected this.</p>
<p> This friend of his had first arrived on the planet some fifteen Earth years previously, and he had worked
hard to
blend himself into Earth society - with, it must be said, some success. For instance he had spent those
fifteen
years pretending to be an out of work actor, which was plausible enough.</p>
<p> He had made one careless blunder though, because he had skimped a bit on his preparatory research. The
information
he style="color: red"had gathered had led him to choose the name &quot;Ford Prefect&quot; as being nicely
inconspicuous.</p>
<p> He was not conspicuously tall, his features were striking but not conspicuously handsome. His hair was wiry
and
gingerish and brushed backwards from the temples. His skin seemed to be pulled backwards from the nose.
There was
something very slightly odd about him, but it was difficult to say what it was. Perhaps it was that his eyes
didn&#39;t blink often enough and when you talked to him for any length of time your eyes began
involuntarily to
water on his behalf. Perhaps it was that he smiled slightly too broadly and gave people the unnerving
impression
that he was about to go for their neck.</p>
<p> He struck most of the friends he had made on Earth as an eccentric, but a harmless one -- an unruly boozer
with some
oddish habits. For instance he would often gatecrash university parties, get badly drunk and start making
fun of any
astrophysicist he could find till he got thrown out.</p>
<p> Sometimes he would get seized with oddly distracted moods and stare into the sky as if hypnotized until
someone
asked him what he was doing. Then he would start guiltily for a moment, relax and grin.</p>
<p> &quot;Oh, just looking for flying saucers,&quot; he would joke and everyone would laugh and ask him what
sort of
flying saucers he was looking for.</p>
<p> &quot;Green ones!&quot; he would reply with a wicked grin, laugh wildly for a moment and then suddenly lunge
for the
nearest bar and buy an enormous round of drinks.</p>
<p>Evenings like this usually ended badly. Ford would get out of his skull on whisky, huddle into a corner with
some
gir style="color: red"l and explain to her in slurred phrases that honestly the colour of the flying saucers
didn&#39;t matter
that
much really.</p>
<p> Thereafter, staggering semi-paralytic down the night streets he would often ask passing policemen if they
knew the
way to Betelgeuse. The policemen would usually say something like, &quot;Don&#39;t you think it&#39;s about
time you
went off home sir?&quot; &quot;I&#39;m trying to baby, I&#39;m trying to,&quot; is what Ford invariably
replied on
these occasions.</p>
<p> style="color: red" In fact what he was really looking out for when he stared distractedly into the night sky
was any kind of
flying
saucer at all. The reason he said green was that green was the traditional space livery of the Betelgeuse
trading
scouts.</p>
<p> Ford Prefect was desperate that any flying saucer at all would arrive soon because fifteen years was a long
time to
get stranded anywhere, particularly somewhere as mindboggingly dull as the Earth.</p>
<p> Ford wished that a flying saucer would arrive soon because he knew how to flag flying saucers down and get
lifts
from them. He knew how to see the Marvels of the Universe for less than thirty Altairan dollars a day.</p>
<p> In fact, Ford Prefect was a roving researcher for that wholly remarkable book The Hitch Hiker&#39;s Guide to
the
Galaxy.</p>
<p> Human beings are great adaptors, and by lunchtime life in the environs of Arthur&#39;s house had settled
into a
steady routine. It was Arthur&#39;s accepted role to lie squelching in the mud making occasional demands to
see his
lawyer, his mother or a good book; it was Mr Prosser&#39;s accepted role to tackle Arthur with the
occasional new
ploy such as the For the Public Good talk, the March of Progress talk, the They Knocked My House Down Once
You Know,
Never Looked Back talk and various other cajoleries and threats; and it was the bulldozer drivers&#39;
accepted role
to sit around drinking coffee and experimenting with union regulations to see how they could turn the
situation to
their financial advantage.</p>
<p> The Earth moved slowly in its diurnal course.</p>
<p> The sun was beginning to dry out the mud Arthur lay in.</p>
<p> A shadow moved across him again.</p>
<p> &quot;Hello Arthur,&quot; said the shadow.</p>
<p> Arthur looked up and squinting into the sun was startled to see Ford Prefect standing above him.</p>
<p> &quot;Ford! Hello, how are you?&quot; &quot;Fine,&quot; said Ford, &quot;look, are you busy?&quot; &quot;Am
I
busy?&quot; exclaimed Arthur. &quot;Well, I&#39;ve just got all these bulldozers and things to lie in front
of
because they&#39;ll knock my house down if I don&#39;t, but other than that ... well, no not especially,
why?&quot;
They don&#39;t have sarcasm on Betelgeuse, and Ford Prefect often failed to notice it unless he was
concentrating.
He said, &quot;Good, is there anywhere we can talk?&quot; &quot;What?&quot; said Arthur Dent.</p>
<p> style="color: red" For a few seconds Ford seemed to ignore him, and stared fixedly into the sky like a
rabbit trying to get run
over by
a car. Then suddenly he squatted down beside Arthur.</p>
<p> &quot;We&#39;ve got to talk,&quot; he said urgently.</p>
<p> &quot;Fine,&quot; said Arthur, &quot;talk.&quot; &quot;And drink,&quot; said Ford. &quot;It&#39;s vitally
important
that we talk and drink. Now. We&#39;ll go to the pub in the village.&quot; He looked into the sky again,
nervous,
expectant.</p>
<p> &quot;Look, don&#39;t you understand?&quot; shouted Arthur. He pointed at Prosser. &quot;That man wants to
knock my
house down!&quot; Ford glanced at him, puzzled.</p>
<p> &quot;Well he can do it while you&#39;re away can&#39;t he?&quot; he asked.</p>
<p> &quot;But I don&#39;t want him to!&quot; &quot;Ah.&quot;</p>
<p>&quot;Look, what&#39;s the matter with you Ford?&quot; said Arthur.</p>
<p> &quot;Nothing. Nothing&#39;s the matter. Listen to me - I&#39;ve got to tell you the most important thing
you&#39;ve
ever heard. I&#39;ve got to tell you now, and I&#39;ve got to tell you in the saloon bar of the Horse and
Gro style="color: red"om.&quot; &quot;But why?&quot; &quot;Because you are going to need a very stiff
drink.&quot; Ford stared
at
Arthur, and Arthur was astonished to find that his will was beginning to weaken. He didn&#39;t realize that
this was
because of an old drinking game that Ford learned to play in the hyperspace ports that served the madranite
mining
belts in the star system of Orion Beta.</p>
<p> The game was not unlike the Earth game called Indian Wrestling, and was played like this: Two contestants
would sit
either side of a table, with a glass in front of each of them.</p>
<p> Between them would be placed a bottle of Janx Spirit (as immortalized in that ancient Orion mining song
&quot;Oh
don&#39;t give me none more of that Old Janx Spirit/ No, don&#39;t you give me none more of that Old Janx
Spirit/
For my head will fly, my tongue will lie, my eyes will fry and I may die/ Won&#39;t you pour me one more of
that
sinful Old Janx Spirit&quot;).</p>
<p> Each of the two contestants would then concentrate their will on the bottle and attempt to tip it and pour
spirit
into the glass of his opponent - who would then have to drink it.</p>
<p> The bottle would then be refilled. The game would be played again. And again.</p>
<p> Once you started to lose you would probably keep losing, because one of the effects of Janx spirit is to
depress
telepsychic power.</p>
<p> style="color: red" As soon as a predetermined quantity had been consumed, the final loser would have to
perform a forfeit,
which was
usually obscenely biological.</p>
<p> Ford Prefect usually played to lose.</p>
<p> style="color: red" Ford stared at Arthur, who began to think that perhaps he did want to go to the Horse and
Groom after all.
</p>
<p> &quot;But what about my house ...?&quot; he asked plaintively.</p>
<p> Ford looked across to Mr Prosser, and suddenly a wicked thought struck him.</p>
<p> &quot;He wants to knock your house down?&quot; &quot;Yes, he wants to build ...&quot; &quot;And he can&#39;t
because
you&#39;re lying in front of the bulldozers?&quot; &quot;Yes, and ...&quot; &quot;I&#39;m sure we can come
to some
arrangement,&quot; said Ford. &quot;Excuse me!&quot; he shouted.</p>
<p> Mr Prosser (who was arguing with a spokesman for the bulldozer drivers about whether or not Arthur Dent
constituted
a mental health hazard, and how much they should get paid if he did) looked around. He was surprised and
slightly
alarmed to find that Arthur had company.</p>
<p> &quot;Yes? Hello?&quot; he called. &quot;Has Mr Dent come to his senses yet?&quot; &quot;Can we for the
moment,&quot; called Ford, &quot;assume that he hasn&#39;t?&quot; &quot;Well?&quot; sighed Mr Prosser.</p>
<p> &quot;And can we also assume,&quot; said Ford, &quot;that he&#39;s going to be staying here all day?&quot;
&quot;So?&quot; &quot;So all your men are going to be standing around all day doing nothing?&quot;
&quot;Could be,
could be ...&quot; &quot;Well, if you&#39;re resigned to doing that anyway, you don&#39;t actually need him
to lie
here all the time do you?&quot; &quot;What?&quot; &quot;You don&#39;t,&quot; said Ford patiently,
&quot;actually
need him here.&quot; Mr Prosser thought about this.</p>
<p> &quot;Well no, not as such...&quot;, he said, &quot;not exactly need ...&quot; Prosser was worried. He
thought that
one of them wasn&#39;t making a lot of sense.</p>
<p>Ford said, &quot;So if you would just like to take it as read that he&#39;s actually here, then he and I
could slip
off down to the pub for half an hour. How does that sound?&quot; Mr Prosser thought it sounded perfectly
potty.</p>
<p> &quot;That sounds perfectly reasonable,&quot; he said in a reassuring tone of voice, wondering who he was
trying to
reassure.</p>
<p> &quot;And if you want to pop off for a quick one yourself later on,&quot; said Ford, &quot;we can always
cover up
for you in return.&quot; &quot;Thank you very much,&quot; said Mr Prosser who no longer knew how to play
this at
all, &quot;thank you very much, yes, that&#39;s very kind ...&quot; He frowned, then smiled, then tried to
do both
at once, failed, grasped hold of his fur hat and rolled it fitfully round the top of his head. He could only
assume
that he had just won.</p>
<p> &quot;So,&quot; continued Ford Prefect, &quot;if you would just like to come over here and lie down
...&quot;
&quot;What?&quot; said Mr Prosser.</p>
<p> &quot;Ah, I&#39;m sorry,&quot; said Ford, &quot;perhaps I hadn&#39;t made myself fully clear. Somebody&#39;s
got to
lie in front of the bulldozers haven&#39;t they? Or there won&#39;t be anything to stop them driving into Mr
Dent&#39;s house will there?&quot; &quot;What?&quot; said Mr Prosser again.</p>
<p> &quot;It&#39;s very simple,&quot; said Ford, &quot;my client, Mr Dent, says that he will stop lying here in
the mud
on the sole condition that you come and take over from him.&quot; &quot;What are you talking about?&quot;
said
Arthur, but Ford nudged him with his shoe to be quiet.</p>
<p> &quot;You want me,&quot; said Mr Prosser, spelling out this new thought to himself, &quot;to come and lie
there
...&quot; &quot;Yes.&quot; &quot;In front of the bulldozer?&quot; &quot;Yes.&quot; &quot;Instead of Mr
Dent.&quot;
&quot;Yes.&quot; &quot;In the mud.&quot; &quot;In, as you say it, the mud.&quot; As soon as Mr Prosser
realized that
he was substantially the loser after all, it was as if a weight lifted itself off his shoulders: this was
more like
the world as he knew it. He sighed.</p>
<p> &quot;In return for which you will take Mr Dent with you down to the pub?&quot; &quot;That&#39;s it,&quot;
said
Ford. &quot;That&#39;s it exactly.&quot; Mr Prosser took a few nervous steps forward and stopped.</p>
<p> &quot;Promise?&quot; &quot;Promise,&quot; said Ford. He turned to Arthur.</p>
<p> &quot;Come on,&quot; he said to him, &quot;get up and let the man lie down.&quot; Arthur stood up, feeling
as if he
was in a dream.</p>
<p> Ford beckoned to Prosser who sadly, awkwardly, sat down in the mud. He felt that his whole life was some
kind of
dre style="color: red"am and he sometimes wondered whose it was and whether they were enjoying it. The mud
folded itself round
his
bottom and his arms and oozed into his shoes.</p>
<p> Ford looked at him severely.</p>
<p> &quot;And no sneaky knocking down Mr Dent&#39;s house whilst he&#39;s away, alright?&quot; he said.</p>
<p> &quot;The mere thought,&quot; growled Mr Prosser, &quot;hadn&#39;t even begun to speculate,&quot; he
continued,
settling himself back, &quot;about the merest possibility of crossing my mind.&quot; He saw the bulldozer
driver&#39;s union representative approaching and let his head sink back and closed his eyes. He was trying
to
marshal his arguments for proving that he did not now constitute a mental health hazard himself. He was far
from
certain about this - his mind seemed to be full of noise, horses, smoke, and the stench of blood. This
always
happened when he felt miserable and put upon, and he had never been able to explain it to himself. In a high
dimension of which we know nothing the mighty Khan bellowed with rage, but Mr Prosser only trembled slightly
and
whi style="color: red"mpered. He began to fell little pricks of water</p>
<p>behind the eyelids. Bureaucratic cock-ups, angry men lying in the mud, indecipherable strangers handing out
inexplicable humiliations and an unidentified army of horsemen laughing at him in his head - what a day.</p>
<p> What a day. Ford Prefect knew that it didn&#39;t matter a pair of dingo&#39;s kidneys whether Arthur&#39;s
house got
knocked down or not now.</p>
<p> Arthur remained very worried.</p>
<p> &quot;But can we trust him?&quot; he said.</p>
<p> &quot;Myself I&#39;d trust him to the end of the Earth,&quot; said Ford.</p>
<p> &quot;Oh yes,&quot; said Arthur, &quot;and how far&#39;s that?&quot; &quot;About twelve minutes away,&quot;
said
Ford, &quot;come on, I need a drink.&quot;</p>
</article>
<footer>
</footer>
<nav>
I'm a navbar and i'm only visible during scroll!
</nav>
</body>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function () {
var timeout = false;
var footer = document.querySelector("footer");
window.addEventListener("scroll", () => {
console.log("got a scroll", document.documentElement.scrollTop, document.documentElement.scrollHeight);
var scrollable = (document.documentElement.scrollHeight || document.body.scrollHeight)
var percent = (document.documentElement.scrollTop || document.body.scrollTop) / (scrollable - document.documentElement.clientHeight) * 100;
footer.textContent = `Scrolled: ${window.scrollY} scrollHeight: ${scrollable} so im at ${Math.round(percent)}%, ${window.innerWidth}x${window.innerHeight}`;
footer.style.color = percent > 50 ? 'green' : 'black';
if (!timeout) {
document.querySelector("nav").classList.add("visible");
timeout = window.setTimeout(function () {
document.querySelector("nav").classList.remove("visible");
timeout = false;
}, 2000);
}
})
document.querySelectorAll(".fn-range").forEach((rangeEl) => {
rangeEl.addEventListener("change", (e) => {
console.log("e.value", e.target.value);
})
rangeEl.addEventListener("input", (e) => {
console.log("e.input", e.value);
document.querySelector(".fn-range-value").textContent = `From a JS event, i got this new value: ${e.target.value}`
})
})
})
</script>
</html>