Hallo, ich habe für die Navigation meiner Webseite Dropdownmenüs für die Navigationsbuttons erstellt, welchee mit jedoch ein kleiens Problem bereiten.
Funktioniert halt so, dass man auf einen Button klickt, dann öffnet sich darunter eine kleine Navigatigation (dropdown Menü) in dem einige Sublinks sind.
Das ganze sieht erstma so aus:
Script+Stylesheet
<SCRIPT LANGUAGE="JavaScript">
function test(x) {
if (navigator.appName == 'Microsoft Internet Explorer')
x.blur();
}
function show_layer(x)
{
if(document.layers)
document.layers[x].visibility="show";
else
document.all[x].style.visibility="visible";
}
function hide_layer(x)
{
if(document.layers)
document.layers[x].visibility="hide";
else
document.all[x].style.visibility="hidden";
}
var old;
var memold;
var subold;
if(document.layers)
{
window.captureEvents(Event.MOUSEDOWN);
window.onmousedown=do_out;
}
else
{
document.onmouseup=do_out;
}
function do_menu(x)
{
if(!old)
old=memold;
if(old!=x)
{
show_layer(x);
old=x;
} else
old="";
}
function do_check(x)
{
if(old && old!=x)
{
hide_layer(old);
show_layer(x);
old=x;
}
do_submenu();
}
function do_out()
{
if(old)
hide_layer(old);
memold=old; old="";
do_submenu();
}
function do_submenu(x)
{
if(subold)
{
hide_layer(subold);
subold="";
}
if(x)
{
show_layer(x);
subold=x;
}
}
function lade(seite) {
parent.pageFrame.location.href = seite;
}
// -->
</script>
<style>
.menu {position: absolute;top:0;z-index: 2;}
.submenu {position: absolute;top: 22;z-index: 1; visibility: hide;visibility: hidden;}
</style>
Alles anzeigen
Und die Buttons+Menü:
<div id="m1" class="menu" style="left:554;top:208;">
[url='javascript:do_menu('m1x')']Button01[/url]
</div>
<div id="m1x" class="submenu" style="left:567;top:238">
<table cellspacing="0" cellpadding="0" border="0" width="137">
<tr><td width="10" height="14">[img]Data/dropdown01.gif[/img]</td><td width="117" height="14">[img]Data/dropdown02.gif[/img]</td><td width="10" height="14">[img]Data/dropdown03.gif[/img]</td></tr>
<tr><td width="10" background="Data/dropdown04.gif"></td><td width="117" background="Data/dropdown05.gif">
[url='ihre.htm'][b]Sublink[/b][/url]
[url='ihre.htm'][b]Sublink[/b][/url]
[url='ihre.htm'][b]Sublink[/b][/url]
[url='ihre.htm']Sublink[/url]</td><td width="10" background="Data/dropdown06.gif"></td></tr>
<tr><td width="10" height="15">[img]Data/dropdown07.gif[/img]</td><td width="117" height="15">[img]Data/dropdown08.gif[/img]</td><td width="10" height="15">[img]Data/dropdown09.gif[/img]</td></tr>
</table>
</div>
Alles anzeigen
Problem:
Die Sachen im <div> Tag scheinen eine fest Position, jenach Auflösung des Monitores (oder so) zu haben. Wenn man das Browserfenster in der Größe verändert, bleiben die Buttons wo sie sind, während sie die Tabelle verschiebt.
Im Internetexplorer (der bei mir die Seite in einer anderen Auflöösung anzeigt) sind die Buttons schon von vorn rein falsch Positioniert.
Weiss jemand, was falsch ist und wie ich das Problem lösen kann?
Danke im vorraus!