Dropdown menu problem
http://beta.mohaa.dk/portfolie/Denne drop down virker fint på min maskine i 1024x768. Dog har jeg lidt problemer med den som jeg håbede nogle kunne svare på.
1.) Ved en anden opløsning end 1024x768 rykker menuen sig, da den tæller fra "venstre side" af browseren, og derfor vil side samme antal pixel fra venstre side af siden ligemeget hvilken opløsning der er brugt. Jeg har ingen anelse om hvordan dette kan laves :(
2.) Siden udfører scriptet og giver en fejl, dog fungerer scriptet som det skal når det er vist i browseren (IE). I IE kan i lige trykke og se fejlen nede i venstre hjørne ;)
Koden er som følger:
<script language="javascript" src="ypSlideOutMenusC.js"></script>
<script language="javascript">
var menus = [
/* Herunder kan du definere hvor på siden at menuen skal droppe ned! (fra venstre, fra oven, menu tyggelse, menu længde)*/
new ypSlideOutMenu("menu1", "down", 360, 117, 70, 70),
new ypSlideOutMenu("menu2", "down", 425, 117, 70, 90),
new ypSlideOutMenu("menu3", "down", 501, 117, 70, 90),
]
for (var i = 0; i < menus.length; i++) {
menus[i].onactivate = new Function("document.getElementById('act" + i + "').className='active';");
menus[i].ondeactivate = new Function("document.getElementById('act" + i + "').className='';");
}
</script>
<table width="714" height="18" border="0" cellpadding="0" cellspacing="0" background="gfx/topmenubackground.gif">
<tr>
<td>
<table width="714" height="16" border="0" cellpadding="0" cellspacing="0" class="menu-tekst">
<tr>
<td width="220"> </td>
<td> <a id="act0" href="#" onmouseover="ypSlideOutMenu.showMenu('menu1')" onmouseout="ypSlideOutMenu.hideMenu('menu1')" class="menu-tekst">Sites
by me</a> | <a id="act1" href="#" onmouseover="ypSlideOutMenu.showMenu('menu2')" onmouseout="ypSlideOutMenu.hideMenu('menu2')" class="menu-tekst">Layouts
by me</a> | <a id="act2" href="#" onmouseover="ypSlideOutMenu.showMenu('menu3')" onmouseout="ypSlideOutMenu.hideMenu('menu3')" class="menu-tekst">Links</a></td>
</tr>
</table>
<div id="menu1Container" >
<div id="menu1Content">
<div class="autoruder">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td> </td>
<td width="66" class="menu"> <a href="#" target="_self" class="menu-tekst">My
own </a></td>
</tr>
<tr>
<td> </td>
<td class="menu"> <a href="#" target="_self" class="menu-tekst">Companies</a></td>
</tr>
<tr>
<td> </td>
<td class="menu"> <a href="#" target="_self" class="menu-tekst">Friends</a></td>
</tr>
<tr>
<td> </td>
<td class="menubuttom"> </td>
</tr>
</table>
</div>
</div>
</div>
<div id="menu2Container">
<div id="menu2Content">
<div class="autoruder">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td> </td>
<td width="66" class="menu"> <a href="#" target="_self" class="menu-tekst">Site
pictures </a></td>
</tr>
<tr>
<td> </td>
<td class="menu"> <a href="#" target="_self" class="menu-tekst">Site
urls </a></td>
</tr>
<tr>
<td> </td>
<td class="menu"> <a href="#" target="_self" class="menu-tekst">Wallpapers</a></td>
</tr>
<tr>
<td> </td>
<td class="menu"> <a href="#" target="_self" class="menu-tekst">Banners</a></td>
</tr>
<tr>
<td> </td>
<td class="menubuttom"> </td>
</tr>
</table>
</div>
</div>
</div>
<div id="menu3Container">
<div id="menu3Content">
<div class="autoruder">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td> </td>
<td width="66" class="menu"> <a href="#" target="_self" class="menu-tekst">My
sites </a></td>
</tr>
<tr>
<td> </td>
<td class="menu"> <a href="#" target="_self" class="menu-tekst">Usefull
sites </a></td>
</tr>
<tr>
<td> </td>
<td class="menubuttom"> </td>
</tr>
</table>
</div>
</div>
</div>
</div>
</td>
</tr>
</table>
Jeg giver 100 points for at få rettet begge fejl, dvs. 50 til hver fejl rettelse. Jeg syntes menuen er fed, og håber derfor at nogle kender til det :D
