トップページ画面下に、下矢印 v（scroll）が表示されるようにしたい

以下のサイトのように、動画の中央に文字を表示したいのですが、
どうすれば、可能でしょうか。特に、どんな画面サイズでも、画面下から
20px程度のところに、常に、下矢印（scroll）が表示されるようにしたいです。
よろしくお願いします。

http://www.anaintercontinental-manza.jp/

行動規範の内容に同意します

回答1件

動画の中央に文字を表示したいならば、VIDEというjQueryプラグインを使用してみてはいかがでしょう。
positionプロパティなどを使用して以下のように行うことができます。

HTML
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <title>タイトル</title>
6    <style type="text/css">
7        * {
8            margin: 0;
9            padding: 0;
10        }
11
12        .box {
13            width: 100%;
14            height: 600px;
15        }
16
17        .box:nth-of-type(2n) {
18            background-color: #000000;
19        }
20
21        .pagetop {
22            position: fixed;
23            right: 20px;
24            bottom: 10px;
25            text-align: center;
26        }
27    </style>
28</head>
29<body>
30<div class="box"></div>
31<div class="box"></div>
32<div class="box"></div>
33<div class="box" id="box"></div>
34<p class="pagetop">
35    <a href="#box">
36        <img src="https://placehold.jp/3d4070/ffffff/60x60.png?text=image" alt="pagetop">
37    </a>
38</p>
39</body>
40</html>