Foros del Web » Creando para Internet » CSS »

menú css

Estas en el tema de menú css en el foro de CSS en Foros del Web. Hola a todos y gracias por vuestro tiempo!! Es mi primer post en este foro y quería saber si alguien me podía echar un cable. ...
  #1 (permalink)  
Antiguo 20/09/2013, 03:30
 
Fecha de Ingreso: septiembre-2013
Mensajes: 2
Antigüedad: 5 años, 2 meses
Puntos: 0
Pregunta menú css

Hola a todos y gracias por vuestro tiempo!!

Es mi primer post en este foro y quería saber si alguien me podía echar un cable.

Resulta que estoy probando de instalar un menú en CSS para mi tienda pero necesitaría modificarlo de tal forma que al cargarse apareciese desplegada la primera subcategoría y que esta quedará fija (que no se escondiera). El resto de subcategorías si que me interesa que se escondan. Espero haberme explicado

Os copio el código del menú:

Código:
<?
    // cssMenu - Begin of configuration //
   
    $cssMenuConfig = array();
    $cssMenuConfig['ShowEmptyCategories'] = false;  // Should CSS Menu show empty categories? true / false;

    // cssMenu - End of configuration //
?>
<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 200px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
font-family: arial;
font-size: 11px;
}
	
.suckerdiv ul li{
position: relative;
background-color: #eee;
}
	
/*1st level sub menu style */
.suckerdiv ul li ul{
left: 199px; /* Parent menu width - 1*/
position: absolute;
width: 200px; /*sub menu width*/
top: 0;
display: none;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul{ 
left: 199px; /* Parent menu width - 1*/
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li a{ 
left: 199px; /* Parent menu width - 1*/
background-color: #ddd;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul li a{ 
background-color: #bbb;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul li ul li a{ 
background-color: #aaa;
}

/* menu links style */
.suckerdiv ul li a{
display: block;
color: black;
text-decoration: none;
background-color: #eee;
padding: 1px 5px;
border: 1px solid #ccc;
border-bottom: 0;
line-height: 2em;
}

.suckerdiv ul li a:visited{
color: black;
}

.suckerdiv ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

.suckerdiv ul li ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

.suckerdiv ul li ul li ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

/* The main categories with sub-categories */
.suckerdiv .subfolderstyle{
background: url(images/arrow-list.gif) no-repeat center right;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul .subfolderstyle {
background-color: #ddd;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul li ul .subfolderstyle {
background-color: #bbb;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul li ul li ul .subfolderstyle {
background-color: #aaa;
}
	
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */

</style>

<script type="text/javascript">

//SuckerTree Vertical Menu (Aug 4th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas

function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
    for (var t=0; t<ultags.length; t++){
    ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
    ultags[t].parentNode.onmouseover=function(){
    this.getElementsByTagName("ul")[0].style.display="block"
    }
    ultags[t].parentNode.onmouseout=function(){
    this.getElementsByTagName("ul")[0].style.display="none"
    }
    }
  }
}

if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)

</script>
<?
  function PrintSubMenus( $parentID, $languageID, $start_path ){

      global $cssMenuConfig;

      $returnval = '';
      if (($start_path == '') && ($parentID > 0)) {
        $start_path = $parentID;
      } else {
        if ($parentID > 0) $start_path .= "_" . $parentID;
      }
      if ($parentID != 0) {
        $returnval .= "<ul>";
      } else {
        $returnval .= "<div class='suckerdiv'>";
        $returnval .= "<ul id='suckertree1'>";
      }
      $categories_query = tep_db_query("select c.categories_id, cd.categories_name, c.parent_id from " . TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd where c.parent_id = '".$parentID."' and c.categories_id = cd.categories_id and cd.language_id='" . (int)$languageID ."' order by sort_order, cd.categories_name");
      while ($categories = tep_db_fetch_array($categories_query))  {
        if ($start_path == "") {
          $grouppath = $categories['categories_id'];
        } else {
          $grouppath = $start_path . "_" . $categories['categories_id'];
        }
        $cPath_new = 'cPath=' . $grouppath;
        $categories_string = tep_href_link(FILENAME_DEFAULT, $cPath_new);
        $totalitemsincategory = tep_count_products_in_category($categories['categories_id']);
        if (cssMenu_ShowCategory($cssMenuConfig['ShowEmptyCategories'], $totalitemsincategory)) {
            $returnval .= "<li><a href='".$categories_string."'>".$categories['categories_name']."</a>";
        }
        if ( tep_has_category_subcategories($categories['categories_id'] ) ) {
           $returnval .= PrintSubMenus( $categories['categories_id'], $languageID, $start_path );
        }
        if (cssMenu_ShowCategory($cssMenuConfig['ShowEmptyCategories'], $totalitemsincategory)) {
           $returnval .= "</li>";
        }
      }
      $returnval .= "</ul>";
      if ($parentID == 0) $returnval .= "</div>";
      return $returnval;
  }

  function cssMenu_ShowCategory( $switch, $products) {
      if ( $switch == 1 ) {
         return true;
      } else {
        if ($products > 0) {
           return true;
        } else {
           return false;
        }
      }
  }
?>
<!-- categories //-->
          <tr>
            <td>
<?php
  $info_box_contents = array();
  $info_box_contents[] = array('text' => BOX_HEADING_CATEGORIES);

  new infoBoxHeading($info_box_contents, true, false);

  $info_box_contents = array();
  $info_box_contents[] = array('text' => PrintSubMenus( 0, $languages_id, '' ));

  new infoBox($info_box_contents);

?>
            </td>
          </tr>
<!-- categories_eof //-->
Muchas Gracias de nuevo.
Saludos desde Palma!!!
  #2 (permalink)  
Antiguo 20/09/2013, 03:59
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.481
Antigüedad: 16 años, 4 meses
Puntos: 2109
Respuesta: menú css

Bienvenido al foro.

No me queda claro lo que quieres hacer, ni tampoco me queda muy claro si es cosa de CSS, o más bien de JavaScript o PHP.

Ten en cuenta que no sabemos lo que hace o no tu página, por eso, cuanto más claro quede mejor.
  #3 (permalink)  
Antiguo 21/09/2013, 03:25
 
Fecha de Ingreso: septiembre-2013
Mensajes: 2
Antigüedad: 5 años, 2 meses
Puntos: 0
Respuesta: menú css

Buenos días Pzin,

Lo primero agradecerte que te hayas interesado en mi pregunta.
Voy a ser más claro ya que me parece que di por supuesta información (cosas de novato... ).

Se trata de un menú de las categorías de mi tienda, por defecto aparece en pantalla la primera categoría y cuando pasas el puntero del ratón se van desplegando (apareciendo) las subcategorías que incluye.
Yo lo que quiero es que por defecto aparezca cagada la primera subcategoría en vez de la categoría 'madre' y que a partir de ahí siga su funcionamiento normal de ir abriendo las siguientes sub-subcategorías. La idea es de alguna forma que ignore la categoría 'madre' y que directamente empiece con la primera subcategoría. Por supuesto el lugar donde debe aparecer es donde está ahora la categoría.

Espero que me haya expresado mejor pero de todas formas te pongo un pantallazo para que quede claro. Si de todas formas hay alguna duda estoy a tu disposición!!
http://turbohobby.com/images/menucss.jpg


Gracias de nuevo!!!!!

Etiquetas: background, color, hover, html
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




La zona horaria es GMT -6. Ahora son las 17:18.