-
Notifications
You must be signed in to change notification settings - Fork 0
/
360.html
130 lines (122 loc) · 4.74 KB
/
360.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
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE HTML>
<!--
Binary by TEMPLATED
templated.co @templatedco
Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
-->
<html>
<head>
<title>Les chaumières</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="assets/css/main.css" />
<link rel="stylesheet" href="css/style-global.css" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<link rel="stylesheet prefetch"
href="https://cdn.rawgit.com/mistic100/Photo-Sphere-Viewer/3.1.0/dist/photo-sphere-viewer.min.css">
<style class="cp-pen-styles">
#photosphere {
height: 600px;
width: 800px;
margin: 0 auto;
}
#turnesphère {
height: 600px;
width: 800px;
margin-bottom: 200px;
}
</style>
</head>
<body>
<!-- Header -->
<header id="header">
<a href="/" class="logo"><strong>Astérix</strong> by CDP2018</a>
<div class="navigation">
<span class=""><a href="index.php">Introduction</a></span>
<i class="fas fa-angle-right"></i>
<span class=""><a href="mot.php">Mot aux parents</a></span>
<i class="fas fa-angle-right"></i>
<span class=""><a href="carte.php">Découverte du village</a></span>
<i class="fas fa-angle-right"></i>
<span class=""><a href="todo.php">To-Do-List</a></span>
</div>
<nav>
<!--<a href="#menu">Menu</a>-->
</nav>
</header>
<!-- Main -->
<section id="main">
<div class="inner">
<!--<div class="image fit">
<img src="images/pic11.jpg" alt="" />
</div>-->
<header>
<h1>Découverte des chaumières</h1>
</header>
<p>Escalier des résidences</p>
<p>Une turne. La photo est un peu bizarre, c'est juste que c'est assez dur de prendre des
photo-sphère en intérieur</p>
<div class="centerBloc">
<div id="photosphere"></div>
<br>
</div>
</div>
<div class="inner">
<div class="centerBloc">
<div id="turnesphère"></div>
</div>
</div>
</section>
<!-- Footer -->
<footer id="footer">
<ul class="icons">
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
</ul>
<div class="copyright">
<!--© Untitled. Design: <a href="https://templated.co">TEMPLATED</a>. Images: <a href="https://unsplash.com">Unsplash</a>.-->
</div>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/threejs/r70/three.min.js"></script>
<script src="https://cdn.rawgit.com/mistic100/Photo-Sphere-Viewer/3.1.0/dist/photo-sphere-viewer.min.js"></script>
<script>
var turnePhotosphere = new PhotoSphereViewer({
panorama: './images/photospheres/turne1.jpg',
container: 'photosphere',
loading_img: 'https://raw.githubusercontent.com/mistic100/Photo-Sphere-Viewer/3.1.0/example/photosphere-logo.gif',
navbar: 'autorotate zoom download fullscreen',
caption: 'Turne de 1e année',
default_fov: 65,
mousewheel: false,
size: {
height: 600
}
});
var escalierPhotosphere = new PhotoSphereViewer({
panorama: './images/photospheres/escalier.jpg',
container: 'photosphere',
loading_img: 'https://raw.githubusercontent.com/mistic100/Photo-Sphere-Viewer/3.1.0/example/photosphere-logo.gif',
navbar: 'autorotate zoom download fullscreen',
caption: 'Escalier du bâtiment des 1A',
default_fov: 65,
mousewheel: false,
size: {
height: 600
}
});
</script>
<!--<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"
integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"
crossorigin="anonymous"></script>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>