Advanced Search

CSS / SQL / .NET menu bar

/ Published in: C#
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. //---------------------------------------
  2. //CSS Code
  3. dl, dt, dd{
  4. margin: 0;
  5. padding: 0;
  6. list-style-type: none;
  7. }
  8.  
  9. .smenu, .smenu li {
  10. margin: 0;
  11. padding: 0;
  12. list-style-type: none;
  13. }
  14.  
  15. #menu2 {
  16. }
  17.  
  18. dl#menu2 {
  19. width: 150px;
  20. }
  21.  
  22. dl#menu2 dt {
  23. cursor: pointer;
  24. margin: 2px;
  25. padding: 1px 5px 1px 5px;
  26. text-align: left;
  27. font-weight: bold;
  28. background: url(../images/menu_bg2.png) no-repeat;
  29. padding-bottom: 5px;
  30. }
  31.  
  32. dl#menu2 dt:hover {
  33. background: url(../images/menu_bg3.png) no-repeat;
  34. color: #fff;
  35. }
  36.  
  37. dl#menu2 a:hover {
  38. color:#fff;
  39. }
  40.  
  41. dl#menu2 dd li {
  42. padding-bottom: 2px;
  43. }
  44.  
  45. dl#menu2 ul { margin:0px; padding:0px;}
  46.  
  47. dl#menu2 li {
  48. text-align: left;
  49. padding: 1px 5px 1px 20px;
  50. width: 120px;
  51. }
  52.  
  53. dl#menu2 li a, dl#menu2 dt a {
  54. color: #006685;
  55. text-decoration: none;
  56. height: 100%;
  57. }
  58.  
  59. dl#menu2 li:hover {
  60. background: #729dc9;
  61. }
  62. //---------------------------------------
  63.  
  64. //---------------------------------------
  65. // Jscript component to expand/collapse
  66.     window.onload=expand;
  67.     function expand(id) {
  68.     var d = document.getElementById(id);
  69.       for (var i = 1; i<=10; i++) {
  70.         if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
  71.       }
  72.     if (d) {d.style.display='block';}
  73.     }
  74. //---------------------------------------
  75.  
  76. //---------------------------------------
  77. //DB Table Requirements
  78. //menuID, menuItem, menuLink, parentMenuID, displayOrder, publishDate, expDate
  79. //---------------------------------------
  80.  
  81. //---------------------------------------
  82. //.Net 2.0 Code to put menu into a Label
  83. //Build and output main left bar navigation
  84.         someTableAdapters.parentMenuTableAdapter menuAdapter = new someTableAdapters.parentMenuTableAdapter();
  85.         some_Menu.parentMenuDataTable parentItems;
  86.         parentItems = menuAdapter.GetData();
  87.         int x = 1;
  88.         LeftMenu.Text = "<dl id=\"menu2\">\n";
  89.         foreach (some_Menu.parentMenuRow menuRow in parentItems)
  90.         {
  91.             LeftMenu.Text = LeftMenu.Text + "<dt onclick=\"javascript:expand('smenu" + x +"');\">» <a href=\"#\">" + menuRow.menuItem + "</a></dt>";
  92.  
  93.         #region Sub Menu
  94.             someTableAdapters.subMenuTableAdapter subAdapter = new someTableAdapters.subMenuTableAdapter();
  95.             some_Menu.subMenuDataTable subItems;
  96.             subItems = subAdapter.GetData(menuRow.menuID);
  97.             LeftMenu.Text = LeftMenu.Text + "<dd id=\"smenu" + x + "\">\n";
  98.             LeftMenu.Text = LeftMenu.Text + "<ul class=\"smenu\">\n";
  99.             foreach (some_Menu.subMenuRow subRow in subItems)
  100.             {
  101.                 LeftMenu.Text = LeftMenu.Text + "<li><a href=\"" + subRow.menuLink + "\">" + subRow.menuItem + "</a></li>\n";
  102.             }
  103.             LeftMenu.Text = LeftMenu.Text + "</ul></dd>\n";
  104.         #endregion
  105.             x++;
  106.         }
  107.         LeftMenu.Text = LeftMenu.Text + "</dl>";
  108. //---------------------------------------

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.