Foros del Web » Programando para Internet » Javascript »

Problema con un menu

 Estas en el tema de Problema con un menu en el foro de Javascript en Foros del Web. Saludos a todos. Mi codigo es elsiguiente: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código HTML: Ver original <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd"> < html xmlns = ...
  #1 (permalink)  
Antiguo 16/08/2010, 14:08
 
Fecha de Ingreso: diciembre-2009
Mensajes: 128
Antigüedad: 14 años, 4 meses
Puntos: 0
Problema con un menu
Saludos a todos. Mi codigo es elsiguiente:

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3.  
  4. <head>
  5.  
  6. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  7.  
  8. <script type="text/javascript" src="ddaccordion.js">
  9.  
  10. /***********************************************
  11. * Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
  12. * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
  13. * This notice must stay intact for legal use
  14. ***********************************************/
  15.  
  16. </script>
  17.  
  18.  
  19. <script type="text/javascript">
  20.  
  21.  
  22. ddaccordion.init({
  23.     headerclass: "submenuheader", //Shared CSS class name of headers group
  24.     contentclass: "submenu", //Shared CSS class name of contents group
  25.     revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
  26.     mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
  27.     collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
  28.     defaultexpanded: [], //index of content(s) open by default [index1, index2, etc] [] denotes no content
  29.     onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
  30.     animatedefault: false, //Should contents open by default be animated into view?
  31.     persiststate: true, //persist state of opened contents within browser session?
  32.     toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
  33.     togglehtml: ["suffix", "<img src='plus.gif' class='statusicon' />", "<img src='minus.gif' class='statusicon' />"], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
  34.     animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
  35.     oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
  36.         //do nothing
  37.     },
  38.     onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
  39.         //do nothing
  40.     }
  41. })
  42.  
  43.  
  44. </script>
  45.  
  46.  
  47. <style type="text/css">
  48.  
  49. .glossymenu{
  50. margin: 5px 0;
  51. padding: 0;
  52. width: 170px; /*width of menu*/
  53. border: 1px solid #9A9A9A;
  54. border-bottom-width: 0;
  55. }
  56.  
  57. .glossymenu a.menuitem{
  58. background: black url(glossyback.gif) repeat-x bottom left;
  59. font: bold 14px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
  60. color: white;
  61. display: block;
  62. position: relative; /*To help in the anchoring of the ".statusicon" icon image*/
  63. width: auto;
  64. padding: 4px 0;
  65. padding-left: 10px;
  66. text-decoration: none;
  67. }
  68.  
  69.  
  70. .glossymenu a.menuitem:visited, .glossymenu .menuitem:active{
  71. color: white;
  72. }
  73.  
  74. .glossymenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
  75. position: absolute;
  76. top: 5px;
  77. right: 5px;
  78. border: none;
  79. }
  80.  
  81. .glossymenu a.menuitem:hover{
  82. background-image: url(glossyback2.gif);
  83. }
  84.  
  85. .glossymenu div.submenu{ /*DIV that contains each sub menu*/
  86. background: white;
  87. }
  88.  
  89. .glossymenu div.submenu ul{ /*UL of each sub menu*/
  90. list-style-type: none;
  91. margin: 0;
  92. padding: 0;
  93. }
  94.  
  95. .glossymenu div.submenu ul li{
  96. border-bottom: 1px solid blue;
  97. }
  98.  
  99. .glossymenu div.submenu ul li a{
  100. display: block;
  101. font: normal 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
  102. color: black;
  103. text-decoration: none;
  104. padding: 2px 0;
  105. padding-left: 10px;
  106. }
  107.  
  108. .glossymenu div.submenu ul li a:hover{
  109. background: #DFDCCB;
  110. colorz: white;
  111. }
  112.  
  113. </style>
  114.  
  115. </head>
  116.  
  117. <body>
  118.  
  119. <div class="glossymenu">
  120. <a class="menuitem" href="http://www.dynamicdrive.com/">Dynamic Drive</a>
  121. <a class="menuitem submenuheader" href="http://www.dynamicdrive.com/style/">CSS Examples</a>
  122. <div class="submenu">
  123.     <ul>
  124.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal CSS Menus</a></li>
  125.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a></li>
  126.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a></li>
  127.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a></li>
  128.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a></li>
  129.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Links & Buttons</a></li>
  130.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Other</a></li>
  131.     <li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Browse All</a></li>
  132.     </ul>
  133. </div>
  134. <a class="menuitem" href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a>
  135. <a class="menuitem" href="http://www.javascriptkit.com/domref/">DOM Reference</a>
  136. <a class="menuitem submenuheader" href="http://www.cssdrive.com">CSS Drive</a>
  137. <div class="submenu">
  138.     <ul>
  139.     <li><a href="http://www.cssdrive.com">CSS Gallery</a></li>
  140.     <li><a href="http://www.cssdrive.com/index.php/menudesigns/">Menu Gallery</a></li>
  141.     <li><a href="http://www.cssdrive.com/index.php/news/">Web Design News</a></li>
  142.     <li><a href="http://www.cssdrive.com/index.php/examples/">CSS Examples</a></li>
  143.     <li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
  144.     <li><a href="http://www.dynamicdrive.com/forums/forumdisplay.php?f=6">CSS Forums</a></li>
  145.     </ul>
  146.     <img src="http://i27.tinypic.com/sy7295.gif" style="margin: 10px 5px" />
  147. </div>
  148. <a class="menuitem" href="http://www.codingforums.com/" style="border-bottom-width: 0">Coding Forums</a>
  149. </div>
  150.  
  151. <p>Assuming the current page is named "current.htm", the below links when navigated to expands a particular header on that page:</p>
  152. <p>
  153. - <a href="current.htm?submenuheader=0">Expand 1st header within "submenuheader" header group</a><br />
  154. </p>
  155.  
  156. <p>Helpful links: </p>
  157. <p>
  158. - <a href="http://www.dynamicdrive.com/dynamicindex17/ddaccordion_suppliment.htm">Adding arbitrary links hat expand/ collapse the contents</a><br />
  159. - <a href="http://www.dynamicdrive.com/dynamicindex17/ddaccordion_suppliment2.htm">Taking advantage of the oninit() and onopenclose() event handlers</a><br />
  160. </p>
  161.  
  162. </body>
  163. </html>

y me genera el siguiente menu:



el problema que tengo son las franjas blancas que me aparecen entre Dynamic Drive y CSS Examples, asi como la que sale entre DOM Reference y CSS Drive, Como se dan cuenta solo salen en donde empieza la parte del menu que tiene sub menu, espero me puedan ayudar con esto porque no se que pasa ya que este codigo lo baje de una pagina donde funciona perfectamente, saludos.

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 07:13.