Autor
Nachricht
michi-feinauer
11.08.2008 um 17:07 (UTC) Titel: Navigation oben nur ein Link
Hallo,
ich habe den Code für die Navigation oben (http://www.homepage-baukasten.de/forum/viewtopic.php?t=56781) .
Jetzt möchte ich ihn so verändern, dass nur ein drei Links nebeneinander zu sehen sind und keine Unterseiten
Auserdem verkleiert sich mein Seiteninhalt (content) wieder.
Hier der Code
Code: <style type="text/css" media="screen">
<!--
body
{
font-family: Arial, sans-serif;
font-size: 11px;
overflow: auto;
padding: 13px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
div.menu
{
position: absolute;
z-index: 3;
top: 200px;
left: 50%;
margin-left:-300px;
width: 100%;
}
.menu li
{
width: 207px;
float: left;
}
.menu a
{
border: 1px solid #F2F2F2;
background-image:url(http://img.webme.com/pic/m/michi-feinauer/button-navioben1.gif);
padding-top: 9px;
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 10px;
display: block;
height: 25px;
color: #FFFFFF;
}
.menu a:hover
{
background-image:url(http://img.webme.com/pic/m/michi-feinauer/button-navioben2.gif);
}
#smenu1, #smenu2, #smenu3
{
font-size: 13px;
display: none;
width: 207px;
float: left;
}
#smenu1 a, #smenu2 a, #smenu3 a
{
font-size: 13px;
font-weight: bold;
padding-top: 9px;
border-top: 0px;
cursor: pointer;
}
//-->
</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');">Gästebuch</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="http://HIER SEITE 1.htm" target="_self">Seiten-Name 1</a></li>
<li><a href="http://HIER SEITE 2.htm" target="_self">Seiten-Name 2</a></li>
<li><a href="http://HIER SEITE 3.htm" target="_self">Seiten-Name 3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Kontakt</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="http://HIER SEITE 1.htm" target="_self">Seiten-Name 1</a></li>
<li><a href="http://HIER SEITE 2.htm" target="_self">Seiten-Name 2</a></li>
<li><a href="http://HIER SEITE 3.htm" target="_self">Seiten-Name 3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Impressum</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="http://HIER SEITE 1.htm" target="_self">Seiten-Name 1</a></li>
<li><a href="http://HIER SEITE 2.htm" target="_self">Seiten-Name 2</a></li>
<li><a href="http://HIER SEITE 3.htm" target="_self">Seiten-Name 3</a></li>
</ul>
</li>
</ul>
</div>
[/code]
Danke für Hilfe!
Zuletzt bearbeitet von michi-feinauer am 11.08.2008, 18:09, insgesamt einmal bearbeitet
↑
numb2008
11.08.2008 um 17:55 (UTC) Titel:
Hi Michi, damit die Unterseiten weg sind muss einfach das braune raus gemacht werden.
Zitat: <style type="text/css" media="screen">
<!--
body
{
font-family: Arial, sans-serif;
font-size: 11px;
overflow: auto;
padding: 13px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
div.menu
{
position: absolute;
z-index: 3;
top: 200px;
left: 50%;
margin-left:-300px;
width: 100%;
}
.menu li
{
width: 207px;
float: left;
}
.menu a
{
border: 1px solid #F2F2F2;
background-image:url(http://img.webme.com/pic/m/michi-feinauer/button-navioben1.gif);
padding-top: 9px;
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 10px;
display: block;
height: 25px;
color: #FFFFFF;
}
.menu a:hover
{
background-image:url(http://img.webme.com/pic/m/michi-feinauer/button-navioben2.gif);
}
#smenu1, #smenu2, #smenu3
{
font-size: 13px;
display: none;
width: 207px;
float: left;
}
#smenu1 a, #smenu2 a, #smenu3 a
{
font-size: 13px;
font-weight: bold;
padding-top: 9px;
border-top: 0px;
cursor: pointer;
}
//-->
</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');">Gästebuch</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="http://HIER SEITE 1.htm" target="_self">Seiten-Name 1</a></li>
<li><a href="http://HIER SEITE 2.htm" target="_self">Seiten-Name 2</a></li>
<li><a href="http://HIER SEITE 3.htm" target="_self">Seiten-Name 3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Kontakt</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="http://HIER SEITE 1.htm" target="_self">Seiten-Name 1</a></li>
<li><a href="http://HIER SEITE 2.htm" target="_self">Seiten-Name 2</a></li>
<li><a href="http://HIER SEITE 3.htm" target="_self">Seiten-Name 3</a></li>
</ul>
</li>
<li><a href="javascript:void(0);" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Impressum</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="http://HIER SEITE 1.htm" target="_self">Seiten-Name 1</a></li>
<li><a href="http://HIER SEITE 2.htm" target="_self">Seiten-Name 2</a></li>
<li><a href="http://HIER SEITE 3.htm" target="_self">Seiten-Name 3</a></li>
</ul>
</li>
</ul>
</div>
______________
↑
michi-feinauer
11.08.2008 um 18:28 (UTC) Titel:
Ja das ist klar, aber dann ist die Hauptseite nicht verlinkt.
Und wenn ich
<a href="http://michi-feinauer.de.tl/G.ae.stebuch.htm" target="_self">Gäßtebuch</a>
drunter setze geht es auch nicht
Kann mir jemand helfen!?
↑
der-bielefeld-club
Premium
Support-Team
Wohnort: Bielefeld
11.08.2008 um 18:46 (UTC) Titel:
Du kannst die Hauptseite so verlinken:
Zitat: <div class="menu">
<li><a href="http://michi-feinauer.de.tl/G.ae.stebuch.htm ""javascript:void(0);" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');"target="_self" >Gästebuch </a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
</ul>
</li>
mfg Dominik
______________
Besucht die offizielle Hilfeseite vom Homepage-Baukasten:
Iceblue Generator |
Red Generator |
Butterfly Generator Zuletzt bearbeitet von der-bielefeld-club am 11.08.2008, 19:47, insgesamt einmal bearbeitet
↑
michi-feinauer
11.08.2008 um 19:09 (UTC) Titel:
↑
der-bielefeld-club
Premium
Support-Team
Wohnort: Bielefeld
11.08.2008 um 19:11 (UTC) Titel:
Was willst du denn nicht mehr haben?
Dieses "Kontakt" und "Impressum"?
Wenn ja, lösch das doch einfach aus den Code.
mfg
______________
Besucht die offizielle Hilfeseite vom Homepage-Baukasten:
Iceblue Generator |
Red Generator |
Butterfly Generator
↑
numb2008
11.08.2008 um 19:18 (UTC) Titel:
Nee Dominik, er meint die Buttons die dazwischen sind, die sollen weg gehen^^
______________
↑
sc-hassel-jugend
11.08.2008 um 19:45 (UTC) Titel:
Versuch es mal hiermit.
Zitat:
<style type="text/css" media="screen">
<!--
body
{
font-family:Arial, sans-serif;
font-size: 10px;
overflow: auto;
padding: 13px;
margin: 0px;
}
ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}
div.menu
{
position: absolute;
z-index: 3;
top: 170px;
left: 23%;
margin-left:0px;
width: 600px;
}
.menu li
{
width: 207px;
float: left;
}
.menu a
{
border: 1px solid #F2F2F2;
background-image:url(http://img.webme.com/pic/m/michi-feinauer/button-navioben1.gif);
padding-top: 9px;
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px 10px;
display: block;
height: 25px;
color: #FFFFFF;
}
.menu a:hover
{
background-image:url(http://img.webme.com/pic/m/michi-feinauer/button-navioben2.gif);
}
#smenu1, #smenu2, #smenu3
font-size: 13px;
display: none;
width: 207px;
float: left;
}
#smenu1 a, #smenu2 a, #smenu3 a
{
font-size: 13px;
font-weight: bold;
padding-top: 9px;
border-top: 0px;
cursor: pointer;
}
//-->
</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="http://michi-feinauer.de.tl/G.ae.stebuch.htm" target="_self">Gästebuch</a></li>
</ul>
</li>
<li><a href="http://michi-feinauer.de.tl/Impressum.htm" target="_self">Impressum</a></li>
</ul>
</li>
<li><a href="http://michi-feinauer.de.tl/Kontakt.htm" target="_self">Kontakt</a></li>
</ul>
</li>
</ul>
</div>
hierdrin kannst du die Position verändern:
Zitat: div.menu
{
position: absolute;
z-index: 3;
top: 170 px;
left: 23 %;
margin-left:0px;
width: 600px;
Probier mal, ob es funktioniert.
↑
michi-feinauer
12.08.2008 um 15:05 (UTC) Titel:
Nein, Sorry
so geht es immer noch nicht
↑
sc-hassel-jugend
12.08.2008 um 15:32 (UTC) Titel:
michi-feinauer hat Folgendes geschrieben: Nein, Sorry
so geht es immer noch nicht
Ja, ja das mit den Buttons:
ändere mal das
Zitat:
div.menu
{
position: absolute;
z-index: 3;
top: 170px;
left: 23%;
margin-left:0px;
width: 621 px;
______________
↑
michi-feinauer
12.08.2008 um 18:52 (UTC) Titel:
DANKE, es geht.
Kann ich eigendlich den Seiteninhalt vom Gästebuch,Kontakt, ... die ganzen Extras etwas nach unten verschieben?
Und mein seiteninhalt verkleinert sich auch durch den code der navigation oben
↑
sc-hassel-jugend
12.08.2008 um 19:36 (UTC) Titel:
Füge bei td.edit.content folgendes hinzu:
die 40px kannst du verändern bis es passt
______________
↑