| 1 | <!DOCTYPE html> |
|---|
| 2 | <html> |
|---|
| 3 | <head> |
|---|
| 4 | <title></title> |
|---|
| 5 | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
|---|
| 6 | <script type='text/javascript' src="js/generalScripts.js"></script> |
|---|
| 7 | <script type='text/javascript'> |
|---|
| 8 | debugger; |
|---|
| 9 | var ddMenu = new DDMenu(); |
|---|
| 10 | var onloadFunction = function() { |
|---|
| 11 | ddMenu.Init("creationMenu", "btnAddMenu"); |
|---|
| 12 | } |
|---|
| 13 | window.onload = onloadFunction; |
|---|
| 14 | </script> |
|---|
| 15 | <style type="text/css"> |
|---|
| 16 | body { |
|---|
| 17 | margin: 0; |
|---|
| 18 | padding: 0; |
|---|
| 19 | } |
|---|
| 20 | |
|---|
| 21 | #btnAddMenu { |
|---|
| 22 | margin: 0; |
|---|
| 23 | padding: 5px; |
|---|
| 24 | background: #5970B2; |
|---|
| 25 | font: bold 16px arial; |
|---|
| 26 | color: #FFF; |
|---|
| 27 | float: left; |
|---|
| 28 | } |
|---|
| 29 | |
|---|
| 30 | #btnAddMenu.down { |
|---|
| 31 | background: #334167; |
|---|
| 32 | } |
|---|
| 33 | |
|---|
| 34 | #creationMenu { |
|---|
| 35 | margin: 0; |
|---|
| 36 | padding: 0; |
|---|
| 37 | z-index: 30; |
|---|
| 38 | visibility: hidden; |
|---|
| 39 | float: left; |
|---|
| 40 | } |
|---|
| 41 | |
|---|
| 42 | #creationMenu li { |
|---|
| 43 | margin: 0; |
|---|
| 44 | padding: 0; |
|---|
| 45 | list-style: none; |
|---|
| 46 | float: left; |
|---|
| 47 | clear: left; |
|---|
| 48 | font: bold 11px arial; |
|---|
| 49 | } |
|---|
| 50 | |
|---|
| 51 | #creationMenu li a img { |
|---|
| 52 | float: left; |
|---|
| 53 | clear: left; |
|---|
| 54 | } |
|---|
| 55 | |
|---|
| 56 | #creationMenu li a { |
|---|
| 57 | display: block; |
|---|
| 58 | float: left; |
|---|
| 59 | margin: 0 1px 0 0; |
|---|
| 60 | padding: 4px 10px; |
|---|
| 61 | width: 100px; |
|---|
| 62 | background: #5970B2; |
|---|
| 63 | color: #FFF; |
|---|
| 64 | text-align: center; |
|---|
| 65 | text-decoration: none; |
|---|
| 66 | } |
|---|
| 67 | |
|---|
| 68 | #creationMenu li a:hover { |
|---|
| 69 | background: #49A3FF; |
|---|
| 70 | } |
|---|
| 71 | |
|---|
| 72 | #creationMenu div { |
|---|
| 73 | position: absolute; |
|---|
| 74 | visibility: hidden; |
|---|
| 75 | margin: 0; |
|---|
| 76 | padding: 0; |
|---|
| 77 | background: #eaebd8; |
|---|
| 78 | border: 1px solid #5970B2; |
|---|
| 79 | } |
|---|
| 80 | |
|---|
| 81 | #creationMenu div a{ |
|---|
| 82 | position: relative; |
|---|
| 83 | float: left; |
|---|
| 84 | display: block; |
|---|
| 85 | clear: left; |
|---|
| 86 | margin: 0; |
|---|
| 87 | padding: 5px 10px 5px 10px; |
|---|
| 88 | width: 75px; |
|---|
| 89 | white-space: nowrap; |
|---|
| 90 | text-align: left; |
|---|
| 91 | text-decoration: none; |
|---|
| 92 | background: #eaebd8; |
|---|
| 93 | color: #2875DE; |
|---|
| 94 | font: 11px arial; |
|---|
| 95 | } |
|---|
| 96 | |
|---|
| 97 | #creationMenu div a:hover { |
|---|
| 98 | background: #49a3ff; |
|---|
| 99 | color: #fff; |
|---|
| 100 | } |
|---|
| 101 | </style> |
|---|
| 102 | </head> |
|---|
| 103 | <body id="BODY"> |
|---|
| 104 | |
|---|
| 105 | <input type="button" value="BUTTON OF AWESOMENESS" id="btnAddMenu" onclick="ddMenu.Show()" /> |
|---|
| 106 | <ul id="creationMenu"> |
|---|
| 107 | <li> |
|---|
| 108 | </img><a href="#" onmouseover="ddMenu.Open('creationMenu_m1')" onmouseout="ddMenu.SetCloseTimer()"><img src="images/icons/survey_bullet.png">Survey</a> |
|---|
| 109 | <div id="creationMenu_m1" onmouseover="ddMenu.CancelCloseTimer()" onmouseout="ddMenu.SetCloseTimer()"> |
|---|
| 110 | <a href="#">+ Add new</a> |
|---|
| 111 | <a href="#">> Add existing</a> |
|---|
| 112 | </div> |
|---|
| 113 | </li> |
|---|
| 114 | <li> |
|---|
| 115 | <a href="#" onmouseover="ddMenu.Open('creationMenu_m2')" onmouseout="ddMenu.SetCloseTimer()"><img src="images/icons/application_bullet.png"></img>Application</a> |
|---|
| 116 | <div id="creationMenu_m2" onmouseover="ddMenu.CancelCloseTimer()" onmouseout="ddMenu.SetCloseTimer()"> |
|---|
| 117 | <a href="#">+ Add new</a> |
|---|
| 118 | <a href="#">> Add existing</a> |
|---|
| 119 | </div> |
|---|
| 120 | </li> |
|---|
| 121 | <li> |
|---|
| 122 | <a href="#" onmouseover="ddMenu.Open('creationMenu_m3')" onmouseout="ddMenu.SetCloseTimer()"><img src="images/icons/dashboard_bullet.png"></img>Dashboard</a> |
|---|
| 123 | <div id="creationMenu_m3" onmouseover="ddMenu.CancelCloseTimer()" onmouseout="ddMenu.SetCloseTimer()"> |
|---|
| 124 | <a href="#">+ Add new</a> |
|---|
| 125 | <a href="#">> Add existing</a> |
|---|
| 126 | </div> |
|---|
| 127 | </li> |
|---|
| 128 | </ul> |
|---|
| 129 | </body> |
|---|
| 130 | </html> |
|---|
