-
Notifications
You must be signed in to change notification settings - Fork 18
/
sample.html
62 lines (58 loc) · 2.11 KB
/
sample.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1">
<title>Sample - Touch Menu Like Android</title>
<link rel="stylesheet" href="src/css/touch-menu-la.css">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="src/css/sample.css">
</head>
<body>
<header>
<i class="material-icons" id="menu-open">menu</i>
<span class="title">Touch Menu L.A.</span>
</header>
<div class="center-icon">
<i class="material-icons arrow">keyboard_backspace</i>
<i class="material-icons">touch_app</i>
<div class="text">Drag</div>
</div>
<div id="menu" class="touch-menu-la">
<div class="inner-header">
Touch Menu
<span>Like Android</span>
</div>
<ul class="menu-items">
<li>
<a href="https://github.com/ericktatsui/Touch-Menu-Like-Android">
<i class="fa fa-github"></i> Github
</a>
</li>
<li>
<a href="mailto:[email protected]">
<i class="fa fa-envelope"></i> [email protected]
</a>
</li>
</ul>
<div class="inner-footer">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla non erat ac leo ultrices blandit sed vel risus. Pellentesque facilisis blandit auctor. Maecenas vestibulum vulputate tincidunt. Mauris nec quam libero. Fusce eget ligula non leo varius condimentum quis ac elit.
</div>
<div class="inner-footer">
<iframe src="https://ghbtns.com/github-btn.html?user=ericktatsui&repo=Touch-Menu-Like-Android&type=star&count=true" frameborder="0" scrolling="0" width="160px" height="30px"></iframe>
</div>
</div>
<script src="lib/hammerjs/hammer.min.js"></script>
<script src="src/js/touch-menu-la.js"></script>
<script>
var TouchMenu = TouchMenuLA({
target: document.getElementById('menu')
});
document.getElementById('menu-open').addEventListener('click', function(){
TouchMenu.toggle();
});
</script>
</body>
</html>