Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag26.07.2011 um 18:54 (UTC)    
Titel: Ideen oder Coolmenü quer

Hallo alle zusammen, ich baue momentan meine Hp um und möchte jetzt gerne ein Coolmenü einfügen, jedoch finde ich optisch nichts ansprechendes was mir so gut gefällt wenn die Punkte untereinander stehen. Deshalb meine Frage: Kann man den Code umschrieben das die Punkte quer direkt unter den Oberpunkten erscheinen oder gibt es eine Möglichkeit das ich nur für die Unterpunkte einen Hintergrund mache ? (Gerne nehme ich auch andere Ideen entgegen um das ganze besser aussehen zu lassen)

Diesen Code von Success4you verwende ich aktuell:

<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

li a
{
padding-right: 20px;padding-top: 5px;
}

div.menu
{
position: absolute;
z-index: 3;
top: 124px;
left: 50%;
margin-left:-405px;
width:905px;
}

.menu li
{
width: 160px;
float: left;
}

.menu a
{
border: 1px solid #292929;
background-color: #999999;
background-image: url(URL);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 23px;
color: #292929;
}

.menu a:hover
{
background-color: #c5c6c5;
background-image: url(URL);
}

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

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: bold;
padding-top: 5px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF;
}
//-->

</style>

<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>



<div class="menu">

<li><a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">Menupunkt1</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">

<li><a href="/tutorials/Menupunkt1.1.htm">Menupunkt1.1</a></li>
<li><a href="/tutorials/Menupunkt1.2.htm">Menupunkt1.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Menupunkt2</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">

<li><a href="/tutorials/Menupunkt2.1.htm">Menupunkt2.1</a></li>
<li><a href="/tutorials/Menupunkt2.2.htm">Menupunkt2.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Menupunkt3</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">

<li><a href="/tutorials/Menupunkt3.1.htm">Menupunkt3.1</a></li>
<li><a href="/tutorials/Menupunkt3.2.htm">Menupunkt3.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Menupunkt4</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">

<li><a href="/tutorials/Menupunkt4.1.htm">Menupunkt4.1</a></li>
<li><a href="/tutorials/Menupunkt4.2.htm">Menupunkt4.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">Menupunkt5</a>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">

<li><a href="/tutorials/Menupunkt5.1.htm">Menupunkt5.1</a></li>
<li><a href="/tutorials/Menupunkt5.2.htm">Menupunkt5.2</a></li>

</ul>
</li>

</div>


Zuletzt bearbeitet von djcenter-bigx am 26.07.2011, 20:06, insgesamt 2-mal bearbeitet
Beitrag27.07.2011 um 07:48 (UTC)    
Titel: Re: Ideen oder Coolmenü quer

djcenter-bigx hat Folgendes geschrieben:
Hallo alle zusammen, ich baue momentan meine Hp um und möchte jetzt gerne ein Coolmenü einfügen, jedoch finde ich optisch nichts ansprechendes was mir so gut gefällt wenn die Punkte untereinander stehen. Deshalb meine Frage: Kann man den Code umschrieben das die Punkte quer direkt unter den Oberpunkten erscheinen oder gibt es eine Möglichkeit das ich nur für die Unterpunkte einen Hintergrund mache ? (Gerne nehme ich auch andere Ideen entgegen um das ganze besser aussehen zu lassen)

Diesen Code von Success4you verwende ich aktuell:

<style type="text/css" media="screen">
<!--
body
{
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

li a
{
padding-right: 20px;padding-top: 5px;
}

div.menu
{
position: absolute;
z-index: 3;
top: 124px;
left: 50%;
margin-left:-405px;
width:905px;
}

.menu li
{
width: 160px;
float: left;
}

.menu a
{
border: 1px solid #292929;
background-color: #999999;
background-image: url(URL);

text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 23px;
color: #292929;
}

.menu a:hover
{
background-color: #c5c6c5;
background-image: url(URL);
}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
background-color: #999999;
background-image: url(URL);

font-size: 14px;
display: none;
width: 160px;
float: left;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a
{
font-weight: bold;
padding-top: 5px;
border-top: 0px;
cursor: pointer;
color: #FFFFFF;
}
//-->

</style>

<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>



<div class="menu">

<li><a href="javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">Menupunkt1</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">

<li><a href="/tutorials/Menupunkt1.1.htm">Menupunkt1.1</a></li>
<li><a href="/tutorials/Menupunkt1.2.htm">Menupunkt1.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Menupunkt2</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">

<li><a href="/tutorials/Menupunkt2.1.htm">Menupunkt2.1</a></li>
<li><a href="/tutorials/Menupunkt2.2.htm">Menupunkt2.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Menupunkt3</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">

<li><a href="/tutorials/Menupunkt3.1.htm">Menupunkt3.1</a></li>
<li><a href="/tutorials/Menupunkt3.2.htm">Menupunkt3.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Menupunkt4</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">

<li><a href="/tutorials/Menupunkt4.1.htm">Menupunkt4.1</a></li>
<li><a href="/tutorials/Menupunkt4.2.htm">Menupunkt4.2</a></li>

</ul>
</li>

<li><a href="javascript:void(0);" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">Menupunkt5</a>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">

<li><a href="/tutorials/Menupunkt5.1.htm">Menupunkt5.1</a></li>
<li><a href="/tutorials/Menupunkt5.2.htm">Menupunkt5.2</a></li>

</ul>
</li>

</div>


So, habe es jetzt so hinbekommen das nur die Unterpunkte den Hintergrund haben.



So alles selber hinbekommen - Closed !


Zuletzt bearbeitet von djcenter-bigx am 28.07.2011, 09:43, insgesamt einmal bearbeitet
Beiträge der letzten Zeit anzeigen:   


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