Advance_Web/video.html at master · Johnny62103/Advance_Web · 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
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Hot Video</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
	<!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
	<!-- Material Design -->
    <link rel="stylesheet" type="text/css" href="bootstrap/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
  </head>
  <body>
	<div class='col col-lg-6'>
		<div id='player'></div>
	</div>
    <div class='col col-lg-6'>
		<ol class='list-group control-time'>
			<a class='list-group-item' onclick='playAt(0.1)'>There are a lot of ways to take a picture of yourself.</a>
			<a class='list-group-item' onclick='playAt(3.42)'>But if you look carefully, something's not quite right about your close-ups.</a>
			<a class='list-group-item' onclick='playAt(7.28)'>Selfies can make our faces look weird and it's changing the way we see ourselves,</a>
			<a class='list-group-item' onclick='playAt(11.86)'>and the decisions we make about our facial features.</a>
			<a class='list-group-item' onclick='playAt(15.38)'>A lot of people think their nose looks big in selfies and it's driving them to get nosejobs.</a>
		</ol>
	</div>
    <script src="script.js"></script>
    <script src="video7.json" type="text/javascript"></script>
  </body>

</html>