-
Notifications
You must be signed in to change notification settings - Fork 0
/
FisheyeMenu-test.html
76 lines (58 loc) · 1.88 KB
/
FisheyeMenu-test.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
<html>
<head>
<title>Fisheye Menu test</title>
<script type="text/javascript" src="XBL.js"></script>
<style type="text/css">
@import url(FisheyeMenu.css);
* {font-size:12px; font-family:Arial,sans-serif;}
#no-image {list-style-image:none !important;} /*test what happens when no icon*/
/* hook up the control panel: */
#controller {margin:10em; -moz-binding:url(FisheyeMenuController.xml#controller);}
#controller th {text-align:right;}
</style>
</head>
<body>
<h1>Test Fisheye Menu</h1>
<ul class="fisheye-menu" id="menu">
<li><a href="http://lojjic.net">Label 1</a></li><!-- linked label -->
<li>Label 2 <!-- text label with child menu -->
<ul>
<li><a href="">Submenu</a></li>
<li><a href="">Submenu</a></li>
<li><a href="">Submenu</a></li>
</ul>
</li>
<li><span></span>Label 3<!-- empty element before text label -->
<ul>
<li><a href="">Submenu</a></li>
<li><a href="">Submenu</a></li>
<li><a href="">Submenu</a></li>
</ul>
</li>
<li><span></span><a href="TitleTips-test.html">Label 4</a></li><!-- empty element before linked label -->
<li id="no-image"><a href="#">Label 5</a></li>
<li><a href="#">Label 6</a></li>
<li>Label 7
<ul>
<li><a href="">Submenu</a></li>
<li><a href="">Submenu</a></li>
<li><a href="">Submenu</a></li>
</ul>
</li>
</ul>
<style type="text/css">
</style>
<div id="controller" title="menu">
<p><input type="button" onclick="
var menu = document.getElementById('menu');
var item = document.createElement('li');
var link = document.createElement('a');
link.href = 'http://lojjic.net';
link.appendChild(document.createTextNode('extra'));
item.appendChild(link);
menu.appendChild(item);
" value="Add Item" /></p>
</div>
<p style="margin-top:200em; margin-left:200em; text-align:right; font-size:.8em;">Making the page scroll...</p>
</body>
</html>