1
0
Fork 0
sfxboard/projection/index.html

50 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>drama projection</title>
<link rel="stylesheet" href="projection.css" />
</head>
<body>
<div id="mur" class="slide">
<h1>4 Rounds</h1>
<p style="width: 100%;">205.</p>
</div>
<div id="flashback" class="slide">
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">
<circle fill="#223447" cx="50.001" cy="50" r="50"/>
<path fill="#fff" d="M50 10c22.093 0 40 17.909 40 40s-17.906 40-40 40c-22.091 0-40-17.909-40-40s17.91-40 40-40z"/>
<path fill="#DAD9D9" d="M50 10.015c-11.806 0-22.413 5.119-29.733 13.254 7.085-6.373 16.456-10.254 26.733-10.254 22.085 0 39.986 17.902 39.986 39.985 0 10.277-3.881 19.646-10.254 26.729 8.139-7.319 13.256-17.924 13.256-29.729 0-22.083-17.902-39.985-39.988-39.985z"/>
<path transform="rotate(90,50,50)" fill="#223447" d="M46 27c0-2.209 1.791-4 4-4s4 1.791 4 4v19c0 2.209-1.791 4-4 4s-4-1.791-4-4v-19z"/>
<path transform="rotate(315,50,50)" fill="#223447" d="M49.996 19.988c1.656.002 3.002 1.221 3.004 3.012v24c0 1.789-1.333 3.002-2.988 3-1.658-.002-3.01-1.209-3.012-3v-24c-.001-1.79 1.34-3.014 2.996-3.012z"/>
<path fill="#223447" d="M46 43.1c3.825-2.21 8.72-.898 10.927 2.927 2.209 3.824.897 8.718-2.928 10.926-3.827 2.209-8.717.898-10.927-2.93-2.207-3.823-.898-8.714 2.928-10.923z"/>
<path transform="rotate(225,50,50)" fill="#E44D41" d="M52 24c0-1.104-.896-2-2-2s-2 .896-2 2v26c0 1.104.896 2 2 2s2-.896 2-2v-26z"/>
</svg>
<h1 style="width: 100%; padding-top: 5%">3 years later</h1>
</div>
<div id="beach" class="slide" style="background-image: url(beach.jpg);">
<br />
</div>
<div id="office" class="slide" style="background-image: url(office2.jpg);">
<br />
</div>
<div id="schcampus" class="slide" style="background-image: url(extschool2.jpg);">
<br />
</div>
<div id="classroom" class="slide" style="background-image: url(classroom.jpg);">
<br />
</div>
<div id="street" class="slide" style="background-image: url(street.jpg);">
<br /><!-- MUST FIX -->
</div>
<div id="bowl" class="slide" style="background-image: url(bowlingalley.jpg); opacity: 0.4;">
<br />
</div>
<div id="kidnapped" class="slide" style="background-image: url(kidnapped.2.jpg); background-size: auto 100%;">
<br />
</div>
<script src="/socket.io/socket.io.js"></script>
<script src="../jquery-2.1.0.min.js"></script>
<script src="projection.js"></script>
</body>
</html>