Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag04.10.2011 um 20:09 (UTC)    
Titel: CSS Design: Coolmenü

Hallo liebe HPBKler,

ich möchte gerne bei meinem Coolmenü (Code: Text unter dem Design:)
Zitat:
<style type="text/css" media="screen">
<!--
/* keine Auflistungspunkte vor Navi-Links */
ul, li {
list-style-type: none;
padding: 0px;
margin: 0px; }

/* Abstand zwischen Schrift zum Rand */
li a {
padding-right: 20px;
padding-top: 5px; }

/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
left: 50%;
top: 259px;
margin-left: 166px;
width:117px; }

/* Breite der Menüpunkte einstellen */
.menu li {
width: 123px;
height: 35px;
float: left; }

/* Aussehen der Menüpunkte einstellen (Hintergrund, Schriftart und Größe) */
.menu a {
border: 0px solid #000000;
background-color: #000000;
background-image: url(http://img.webme.com/pic/g/gygrusher/navinavinewgaming.png);
font-family: Verdana, sans-serif;
font-size: 10px;
text-align: center;
text-decoration: none;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 30px;
color: #FFFFFF;
border: 5px groove #A9A2A2; }

/* Aussehen der Menüpunkte beim Hover Effekt */
.menu a:hover {
background-color: #00CCFF;
background-image: url(http://img.webme.com/pic/o/omba-test/navinavinewgaminghover.png);
color: #e5fcff;
}

#smenu1, smenu2, smenu3, smenu4, smenu5 {
font-size: 14px;
display: none;
width: 160px;
float: left; }

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a, #smenu6 a {
font-weight: bold;
padding-top: 3px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF; }
//-->
</style> <!-- Anfang des Scriptes --> <script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}
function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script> <!-- Ende des Scriptes -->
<div class="menu">
<ul>
<li><a onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" href="javascript:void(0);"><br><span style="color: rgb(192, 192, 192); "><span style="font-size: small; ">Extras</span></span></a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="http://gygrusher.de.tl/Mods.htm">Mods</a></li>
<li><a href="http://gygrusher.de.tl/Spieletipps.htm">Mapptipps& Walkthroughs</a></li>
<li><a href="http://gygrusher.de.tl/Infos.htm">Infos</a></li>
<li><a href="http://gygrusher.de.tl/Specials.htm">Specials</a></li>
<li><a href="http://gygrusher.de.tl/Hardware.htm">Hardwaretipps</a></li>
<li><a href="http://gygrusher.de.tl/Software.htm">Softwaretipps</a></li>
<li><a href="http://gygrusher.de.tl/4-U.htm">4 U</a></li>
<li><a href="http://gygrusher.de.tl/Entertainment.htm">Entertainment</a></li>
<li><a href="http://www.gyg-clan.tk/">Mein Clan</a></li>
</ul>
</li>
</ul>
</div>


dem Hauptmenüpunkt (rot) einen Link hinzufügen. Wenn ich das rotgeschriebene einfach durch den Linkcode ersetze, erscheint es als zusätzlicher Submenüpunkt.

Wie kann ich das ändern?

Danke im Voraus& MFG Jamie
Beitrag04.10.2011 um 20:59 (UTC)    
Titel:

Hallo,

ganz einfach:

Zitat:
<style type="text/css" media="screen">
<!--
/* keine Auflistungspunkte vor Navi-Links */
ul, li {
list-style-type: none;
padding: 0px;
margin: 0px; }

/* Abstand zwischen Schrift zum Rand */
li a {
padding-right: 20px;
padding-top: 5px; }

/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
left: 50%;
top: 259px;
margin-left: 166px;
width:117px; }

/* Breite der Menüpunkte einstellen */
.menu li {
width: 123px;
height: 35px;
float: left; }

/* Aussehen der Menüpunkte einstellen (Hintergrund, Schriftart und Größe) */
.menu a {
border: 0px solid #000000;
background-color: #000000;
background-image: url(http://img.webme.com/pic/g/gygrusher/navinavinewgaming.png);
font-family: Verdana, sans-serif;
font-size: 10px;
text-align: center;
text-decoration: none;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 30px;
color: #FFFFFF;
border: 5px groove #A9A2A2; }

/* Aussehen der Menüpunkte beim Hover Effekt */
.menu a:hover {
background-color: #00CCFF;
background-image: url(http://img.webme.com/pic/o/omba-test/navinavinewgaminghover.png);
color: #e5fcff;
}

#smenu1, smenu2, smenu3, smenu4, smenu5 {
font-size: 14px;
display: none;
width: 160px;
float: left; }

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a, #smenu6 a {
font-weight: bold;
padding-top: 3px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF; }
//-->
</style> <!-- Anfang des Scriptes --> <script type="text/javascript">
<!--
function montre(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}
}
function cache(id)
{
with (document)
{
if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
}
//-->
</script> <!-- Ende des Scriptes -->
<div class="menu">
<ul>
<li><a onmouseover="montre('smenu1');" onmouseout="cache('smenu1');" href="javascript:void(0);"><br><span style="color: rgb(192, 192, 192); "><span style="font-size: small; ">Extras</span></span></a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="http://gygrusher.de.tl/Mods.htm">Mods</a></li>
<li><a href="http://gygrusher.de.tl/Spieletipps.htm">Mapptipps& Walkthroughs</a></li>
<li><a href="http://gygrusher.de.tl/Infos.htm">Infos</a></li>
<li><a href="http://gygrusher.de.tl/Specials.htm">Specials</a></li>
<li><a href="http://gygrusher.de.tl/Hardware.htm">Hardwaretipps</a></li>
<li><a href="http://gygrusher.de.tl/Software.htm">Softwaretipps</a></li>
<li><a href="http://gygrusher.de.tl/4-U.htm">4 U</a></li>
<li><a href="http://gygrusher.de.tl/Entertainment.htm">Entertainment</a></li>
<li><a href="http://www.gyg-clan.tk/">Mein Clan</a></li>
</ul>
</li>
</ul>
</div>

Löschen und die URL hin Wink

Du solltest aber die Verschachtelung deiner Elemente überdenken.
______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering
Beitrag05.10.2011 um 13:10 (UTC)    
Titel:

Danke! Wink

Pls.*Close*
Beitrag05.10.2011 um 13:17 (UTC)    
Titel:

Vielen Dank an o-4-n und auch ein Dankeschön für die Rückmeldung.

-CLOSED-, da erledigt.

mfg Philipp
______________
Forenregeln, FAQ, Suchfunktion
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de