-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
46 lines (42 loc) · 1.9 KB
/
index.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
<!doctype html>
<html>
<head>
<title>Mandelbrot Cat</title>
<link rel="image_src" href="img/thumb.png"/>
<meta charset='utf-8'/>
<meta property='description' content='A mandelbrot set built out of cat gifs.'/>
<meta property='og:title' content='Mandelbrot Cat'/>
<meta property='og:description' content='A mandelbrot set built out of cat gifs.'/>
<meta property='og:image' content='img/thumb.png'/>
<meta property='twitter:title' content='Mandelbrot Cat'/>
<meta property='twitter:description' content='A mandelbrot set built out of cat gifs.'/>
<meta property='twitter:image:src' content='img/thumb.png'/>
<meta name="viewport" content="width=device-width; initial-scale=1.0" />
<link rel='stylesheet' href='styles.css'>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
</head>
<body>
<div class='visualizer'>
<img class='bg' src='img/grumpycat.jpg'>
<img class='eyes' src='img/eyes.png'>
</div>
<div class='explanation'>
<div class='text'>
<h1>Mandelwhat?</h1>
<p>The <a href='http://en.wikipedia.org/wiki/Mandelbrot_set'>Mandelbrot Set</a> is the most famous example of a <a href='http://en.wikipedia.org/wiki/Fractal'>fractal</a>.<br>It's a beautiful pattern that repeats infinitely as you zoom in.</p>
<br><br>
<img src='img/example.jpg'/>
<br><br>
<h2>However, this Mandelbrot Set is constructed with cat gifs.</h2>
<p>Click to zoom in. Try exploring parts with lots of different cats.</p>
<p><a href='/mandelbrotdog'>Actually, I don't like cats. Show me dogs.</a></p>
</div>
</div>
<img class='nav' direction='up' src='img/up.png'/>
<img class='nav' direction='down' src='img/down.png'/>
<img class='nav' direction='left' src='img/left.png'/>
<img class='nav' direction='right' src='img/right.png'/>
<img class='nav zoomout' src='img/zoomout.png'/>
<script src='mandelbrot.js'></script>
</body>
</html>