Foros del Web » Creando para Internet » HTML »

problema con menu

Estas en el tema de problema con menu en el foro de HTML en Foros del Web. Buenas, miren mi problema puede ser bastante simple o muy dificil para otros pero necesito ayuda con este problema, bueno mi problema radica en que ...
  #1 (permalink)  
Antiguo 19/02/2011, 13:46
 
Fecha de Ingreso: febrero-2011
Mensajes: 6
Antigüedad: 6 años, 9 meses
Puntos: 0
problema con menu

Buenas, miren mi problema puede ser bastante simple o muy dificil para otros pero necesito ayuda con este problema, bueno mi problema radica en que yo poseo una web jimdo, bueno el caso es que cuando guardo el diseño, me salen unas bolitas de lista, las cuales no deberian salir, pero si remuevo el id="topmenu" del <ul id="topmenu">, todo el menu se desarma y se pierde todo, asi que debo mantener este "ID", Pero a causa de este id, me aparecen estas bolitas, podrian decirme como solucionar esto?, sin dañar mi menu?

por cierto las a href tienen un #, puesto que aun no coloco las referencias, asi que no se enfocen en ello.

muchas gracias.

aca el html del menu.

Código HTML:
<ul id="topmenu" style="none">
                <li class="parentnode n_home">
                    <a href="#">home</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">COMMENT US</a>
                        </li>

                        <li class="childnode">
                            <a href="#">HELP US</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">anime-z</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">online</a>
                        </li>

                        <li class="childnode">
                            <a href="#">descarga</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">Downloads</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">PDF books</a>
                        </li>

                        <li class="childnode">
                            <a href="#">online GAMES</a>
                        </li>

                        <li class="childnode">
                            <a href="#">free-sources</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">guides</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">Photoshop</a>
                        </li>

                        <li class="childnode">
                            <a href="#">illustrator</a>
                        </li>

                        <li class="childnode">
                            <a href="#">Macromedia Flash</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">about us</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">1er</a>
                        </li>

                        <li class="childnode">
                            <a href="#">2do</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">Gallery</a>
                </li>

                <li class="parentnode">
                    <a href="#">Recomendados</a>
                    <ul>
                        <li class="childnode">
                            <a>FarmStudio</a>
                        </li>

                        <li class="childnode">
                            <a>recomendado 2</a>
                        </li>

                        <li class="childnode">
                            <a href="#">recomendado 3</a>
                        </li>

                        <li class="childnode">
                            <a href="#">recomendado 4</a>
                        </li>
                    </ul>
                </li>
            </ul> 
  #2 (permalink)  
Antiguo 19/02/2011, 13:49
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.049
Antigüedad: 8 años, 7 meses
Puntos: 1484
Respuesta: problema con menu

¿y el CSS que afecta esa lista?
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #3 (permalink)  
Antiguo 19/02/2011, 13:54
 
Fecha de Ingreso: febrero-2011
Mensajes: 6
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: problema con menu

amigo, yo soy muy nuevo en lo que es esto de las web, pero si lo que dices es lo que hace el css en esa lista, pues el estilo?

mejor dejo el css, el html, y una imagen.
  #4 (permalink)  
Antiguo 19/02/2011, 14:02
 
Fecha de Ingreso: febrero-2011
Mensajes: 6
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: problema con menu

CSS

Código HTML:
.topnavigation,
#topnavigation {
	clear: both;
	height: 300px;
	background: url(images/freaklifebanner2.jpg)no-repeat top center;
}

#topmenu {
	position: relative;
}

#topmenu li.parentnode {
	position: relative;
	float: left;
}

#topmenu li.parentnode ul {
	position: absolute;
	width: 200px;
	left: -40px;
	top: 28px;
}

#topmenu li.childnode ul {
	position: absolute;
	top: 0;
	left: 200px;
	width: 200px;
	z-index: 111000;
}

#topmenu ul {
	display: none;
}

#topmenu li:hover > ul {
	display: block;
}

#topmenu ul.showSubMenu,
#topmenu ul.over {
	display: block;
}

#topmenu li.childnode {
	display: block;
	z-index: 1000;
	position: relative;
	_display: inline;
}

#topmenu li.parentnode a {
	height: 22px;
	position: relative;
	padding: 5px 6px 3px 7px;
	border-style: solid;
	border-width: 1px;
	border-color: #404040 #1A1A1A #1A1A1A #505050;
	border-bottom: solid 2px #27292a;
	font-family: arial, sans-serif;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	display: block; /* important! DA */
	_display: inline-block;
	text-transform: uppercase;
}

#topmenu li.parentnode:hover a, 
#topmenu li.parentnode a.selected,
#topmenu li.parentnode a:hover {
	background-color: #1d4171;
}

#topmenu li.parentnode a:active { 
	/* background-color: #55a9d8;*/
}

#topmenu li.childnode a {
	display: block;
	position: relative;
	padding: 6px 8px;
	font-family: arial, sans-serif;
	font-size: 11px;
	text-decoration: none;
	color: #fff;
	border-style: solid;
	border-width: 1px;
	border-color: #2e5282 #1A1A1A #1A1A1A #2e5282;
	background: #1d4171;
	height: auto;
	text-transform: uppercase;
	*min-height: 1px; /* need for ie7 when height= auto ... */
}

#topmenu li.childnode a:hover, 
#topmenu li.childnode a.selected { 
	background: #6d96cb;	
}

#topmenu li.childnode:hover > a {
	background: #6d96cb;
}
HTML
Código HTML:
<ul id="topmenu" style="none">
                <li class="parentnode n_home">
                    <a href="#">home</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">COMMENT US</a>
                        </li>

                        <li class="childnode">
                            <a href="#">HELP US</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">anime-z</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">online</a>
                        </li>

                        <li class="childnode">
                            <a href="#">descarga</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">Downloads</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">PDF books</a>
                        </li>

                        <li class="childnode">
                            <a href="#">online GAMES</a>
                        </li>

                        <li class="childnode">
                            <a href="#">free-sources</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">guides</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">Photoshop</a>
                        </li>

                        <li class="childnode">
                            <a href="#">illustrator</a>
                        </li>

                        <li class="childnode">
                            <a href="#">Macromedia Flash</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">about us</a>
                    <ul>
                        <li class="childnode">
                            <a href="#">1er</a>
                        </li>

                        <li class="childnode">
                            <a href="#">2do</a>
                        </li>
                    </ul>
                </li>

                <li class="parentnode">
                    <a href="#">Gallery</a>
                </li>

                <li class="parentnode">
                    <a href="#">Recomendados</a>
                    <ul>
                        <li class="childnode">
                            <a>FarmStudio</a>
                        </li>

                        <li class="childnode">
                            <a>recomendado 2</a>
                        </li>

                        <li class="childnode">
                            <a href="#">recomendado 3</a>
                        </li>

                        <li class="childnode">
                            <a href="#">recomendado 4</a>
                        </li>
                    </ul>
                </li>
            </ul> 

imagen del menu, para que se hagan una idea lo que intento hacer.

  #5 (permalink)  
Antiguo 19/02/2011, 14:09
 
Fecha de Ingreso: febrero-2011
Mensajes: 6
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: problema con menu

por cierto, el menu lo encontre y lo baje, luego lo modifice un poco, para que encajara mejor con el diseño de la web, y cuando termine me di cuenta que aparecian esas bolitas.
  #6 (permalink)  
Antiguo 19/02/2011, 14:13
Avatar de zerokilled
Javascripter
 
Fecha de Ingreso: abril-2009
Ubicación: Isla del Encanto, La Borinqueña [+>==]
Mensajes: 8.049
Antigüedad: 8 años, 7 meses
Puntos: 1484
Respuesta: problema con menu

tienes que agregar una regla css tal que aplique a todos los <li> de #topmenu con la propiedad list-style-type:none para ocultar el marcador.
__________________
la maldad es una virtud humana,
y la espiritualidad es la lucha del hombre contra su maldad.
  #7 (permalink)  
Antiguo 19/02/2011, 14:22
 
Fecha de Ingreso: febrero-2011
Mensajes: 6
Antigüedad: 6 años, 9 meses
Puntos: 0
Respuesta: problema con menu

muchas gracias, la verdad era en li. parentnode, pero la idea que aportastes me hiso pensar y me fui al parentnode, cuando con el childnode no funciono.

muchas gracias ya arregle el problema

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




La zona horaria es GMT -6. Ahora son las 15:20.