Suche im Forum:
Suchen


Autor Nachricht
Beitrag12.08.2010 um 17:40 (UTC)    
Titel: coolmenu

Hi ich habe ein kleines Problem mit dem coolmenu ich habe es positioniert doch als ich bei einem Kumpel am Pc war habe ich gesehen dass es ganz woander war ! Bei jedem ist das irgentwie woanders wie bekomm ich das da fest wo ich es will?

P.S : Ich möchte es am oberen Ende des Textfeldes haben .


LG Das Lasers-Team
Beitrag12.08.2010 um 17:44 (UTC)    
Titel:

Hi,
tut mir leid, das hier ist der falsche Bereich. Ich verschiebe den Thread mal in den CSS-Fragen Bereich.

Bei einer Navigation wäre es eigentlich immer am optimalsten position: absolute; anzuwenden.
Doch vorsicht! Dort kannst Du dann nur mit den Angaben top: xx px; bottom: xx px;
left: xx px; und right: xx px; positionieren.

Grüße
Andreas
Beitrag13.08.2010 um 09:34 (UTC)    
Titel:

Ähm wo muss ich das denn eingeben? hier is mein code
Code:
<style type="text/css" media="screen">
<!--
/* Allgemeine Einstellungen (Schriftart, Schriftgröße...) */
body {
font-family: Verdana, sans-serif;
font-size: 14px;
overflow: auto;
margin: 0px; }

/* keine Auflistungspunkte vor Navi-Links */
ul, li {
list-style-type: none;
padding: 0px;
margin: 0px; }

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

/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
top: 210px;
left: 305px;
width:1000px; }

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

/* Aussehen der Menüpunkte einstellen */
.menu a {
border: 0px solid #000000;
background-color: #000000;
background-image: url(http://img.webme.com/pic/t/thelasers/button.jpg);
text-decoration: none;
text-align: center;
font-weight: bold;
cursor: pointer;
margin: 0px;
display: block;
height: 23px;
color: #00CCFF; }

/* Aussehen der Menüpunkte beim Hover Effekt */
.menu a:hover {
background-color: #00CCFF;
background-image: url(URL);
color: #000000; }

#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><!-- 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">
<li><a href="http://thelasers.de/Das-sind-wir-ar-.htm" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">das sind wir!</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');"> 
</ul>
</li>
<li><a href="http://thelasers.de/Verastaltungs_News.htm" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">Event-Update</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
<li><a href="http://thelasers.de/NeueEvents.htm">Event-News</a></li>
<li><a href="http://thelasers.de/BilderArchiv.htm">Bilder-Archiv</a></li>
</ul>
</li>
<li><a href="http://thelasers.de/TheLasers_Club.htm" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">Lasers-Club</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="http://thelasers.de/Lasers_Club_Anmeldung.htm">Anmelden</a></li>
<li><a href="http://thelasers.de/AGB.htm">AGB</a></li>
</ul>
<li><a href="http://thelasers.de/-Unsere-Hunde.htm" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">Unsere Hunde</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
</ul>
<li><a href="http://thelasers.de/Youtube_Award.htm" onmouseover="montre('smenu5');" onmouseout="cache('smenu1');">Youtube-Award</a>
<ul id="smenu5" onmouseover="montre('smenu5);" onmouseout="cache('smenu5');"> 
</ul>



Beitrag13.08.2010 um 09:44 (UTC)    
Titel:

Naja, es ist so richtig, es liegt jedoch nur ein Fehler bei der Positionierung vor.
Deine Webseite ist immer so eingestellt, dass diese Mittig auf dem Bildschirm vorhanden ist, d.h es wird anders positioniert als dein Coolmenu - dies wurde so positioniert, dass es immer XX Pixel von Links Abstand hat, so wenn man eine andere Auflösung hat, dann bewegt sich deine Homepage in die Mitte und dein Coolmenü wird immer weiter nach links rutschen, hält aber seine XX Pixel von Links Abstand - es wurde aber nicht so eingestellt, dass es ebenfalls in der Mitte ist.

Deswegen musst du mal folgendes ändern, damit dein Coolmenu ebenfalls in der Mitte ist und sich immer deiner Seite anpasst.

Alter Code

Zitat:
/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
top: 210px;
left: 305px;
width:1000px; }

Neuer Code
Zitat:
/* Coolmenü positionieren, Werte bei "top" , "left" und "width" anpassen */
div.menu {
position: absolute;
z-index: 3;
top: 210px;
left: 50%;
margin-left: -305px;
width:1000px; }


Durch die Positionierung von 50% bei left wird dein Coolmenü immer mit deiner Seite in die Mitte wandern, du musst nur noch bei margin-left deinen genauen Wert eintragen, bis es die passende Stelle hat.
______________
Spendet jetzt für den User -Name entfernt - , damit er sich ein Duden kaufen kann, da seine Schreibkünste die einens 11-jährigen sehr stark ähneln. Smile
Beitrag13.08.2010 um 09:55 (UTC)    
Titel:

Thx für die antwort Smile


LG das lasers-team
Beiträge der letzten Zeit anzeigen:   


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