Menü in zentrierter Seite

Status
Nicht offen für weitere Antworten.

Funster

Grünschnabel
Habe das Problem, dass sich mein Popup-Menü je nach Darstellungsgröße meiner zenrierten Seite, verschiebt.

Weiß jemand wie ich es hinbekomme, dass das Untermenü im an der selben Stelle der Seite bleibt, auch bei unterschiedlicher Seitenauflösung?

Besten Dank schon im voraus
 
Hallo!
Also ... Ich weiß ja nicht aber ich bräuchte dazu Quelltext um dir deinen Fehler sagen zu können^^ Oder die wichtigsten Ausschnitte ;)

Gruß
 
Sehe da ein generelles Menü-Problem bei einer/meiner zentrierten Seite, da sich die Ebene (in der sich das Untermenü befindet und bei MouseOver eingebledet wird) immer am linken oberen Eck ausrichtet und dann die Abstände bei 1024 anders sind als bei 1280 - und somit sich das Untermenü verschiebt.

Meine Frage:
Kann ich die Position des Menue-Button abfragen und sie dann dynamisch (JavaScript) der Ebene zuordnen?
Oder - gibt es generell eine andere Lösung?

Danke
 
bei einer ausrichtung von 1280*1024 passt es so genau -aber leider auch nur bei der :(

hier der quelltext:

HTML:
<script type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

function MM_showHideLayers() { //v6.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}
//-->
</script>
<style type="text/css">
<!--
#Layer1 {
	position:absolute;
	left:320px;
	top:137px;
	width:248px;
	height:167px;
	z-index:1;
	visibility: hidden;
}
-->
</style>
<body onload="MM_preloadImages('vectors/home2.gif','vectors/produkte2.gif','vectors/angebote2.gif','vectors/shop2.gif','vectors/impressum2.gif','vectors/kontakt2.gif')">
<div id="Layer1">Ich werde direkt unter &quot;Image4&quot; eingeblendet.</div>
<div align="center">
  <table width="935" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td align="left" valign="top" bgcolor="#000000"><table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="314"><img src="vectors/logo.gif" alt="Hosendorfer GmbH" width="314" height="70" /></td>
            <td align="right" valign="bottom"><img src="vectors/top35.gif" width="62" height="57" /></td>
            <td width="15" align="right">&nbsp;</td>
          </tr>
      </table></td>
    </tr>
    <tr>
      <td bgcolor="#000000">&nbsp;</td>
    </tr>
    <tr>
      <td height="25" background="vectors/bg_menu.gif" bgcolor="#000000"><table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td height="2" colspan="11" background="vectors/bg_menu_trennung_horizontal.gif"><img src="vectors/spacer.gif" width="10" height="2" /></td>
          </tr>
          <tr>
            <td valign="top"><div align="right"><a href="" target="_self"><img src="vectors/home.gif" name="Image1" width="154" height="25" border="0" id="Image1" onmouseover="MM_swapImage('Image1','','vectors/home2.gif',1)" onmouseout="MM_swapImgRestore()" /></a></div></td>
            <td width="2"><img src="vectors/bg_menu_trennung.gif" width="2" height="25" /></td>
            <td width="100" valign="top"><div align="center"><img src="vectors/produkte.gif" width="154" height="25" id="Image4" onmouseover="MM_swapImage('Image4','','vectors/produkte2.gif',1);MM_showHideLayers('Layer1','','show')" onmouseout="MM_swapImgRestore()" /></div></td>
            <td width="2"><img src="vectors/bg_menu_trennung.gif" width="2" height="25" /></td>
            <td width="100" valign="top"><div align="center"><a href="angebote.php" target="_self"><img src="vectors/angebote.gif" name="Image3" width="154" height="25" border="0" id="Image3" onmouseover="MM_swapImage('Image3','','vectors/angebote2.gif',1)" onmouseout="MM_swapImgRestore()" /></a></div></td>
            <td width="2"><img src="vectors/bg_menu_trennung.gif" width="2" height="25" /></td>
            <td width="100" valign="top"><div align="center"><img src="vectors/shop.gif" width="154" height="25" id="Image5" onmouseover="MM_swapImage('Image5','','vectors/shop2.gif',1)" onmouseout="MM_swapImgRestore()" /></div></td>
            <td width="2"><img src="vectors/bg_menu_trennung.gif" width="2" height="25" /></td>
            <td width="100" valign="top"><div align="center"><a href="impressum.php" target="_self"><img src="vectors/impressum.gif" name="Image6" width="154" height="25" border="0" id="Image6" onmouseover="MM_swapImage('Image6','','vectors/impressum2.gif',1)" onmouseout="MM_swapImgRestore()" /></a></div></td>
            <td width="2"><img src="vectors/bg_menu_trennung.gif" width="2" height="25" /></td>
            <td valign="top"><div align="left"><a href="kontakt.php" target="_self"><img src="vectors/kontakt.gif" name="Image7" width="154" height="25" border="0" id="Image7" onmouseover="MM_swapImage('Image7','','vectors/kontakt2.gif',1)" onmouseout="MM_swapImgRestore()" /></a></div></td>
          </tr>
          <tr>
            <td height="1" colspan="11" valign="top" bgcolor="#A9A8A7"><img src="vectors/spacer.gif" width="10" height="5" /></td>
          </tr>
      </table></td>
    </tr>
  </table>
</div>

Danke
 
Ich empfehle dir, das Seitenlayout ohne Tabellen aufzubauen, denn hierfür sind Tabellen nicht gedacht, und das Dropdown-Menü mit einem verschachtelten Listenelement zu strukturieren - das erspart dir nämlich die Positionsangaben für das Submenü / die Submenüs und wird in allen Bildschirmauflösungen (ohne Verschiebungen) einheitlich dargestellt.

Ein Beispiel für solch ein Listenmenü kannst du dir bei Stu Nicholls anschauen -> http://www.cssplay.co.uk/menus/drop_definition.html
 
Status
Nicht offen für weitere Antworten.
Zurück