5 svar · 369 visningar · startad av roady
Jag har hittat ett javascript där man har en dropdown meny med bilder o så, precis som jag vill ha det.
Så efter en hel del omarbetning så funkar det ungefär som jag vill ha det.. men..
mitt problem är bara att när jag tar musen utanför det som "trillar ner" så skall den ju försvinna, hur löser jag detta ?
någon med tips eller ideér ???
Det kan nog hjälpa om du visar lite kod. 
hihi.. a det är möjligt,, tänkte bara att många blir nog irreterade om man slänger in allt bara.
Så här ser huvudfilen ut iallafall. den där länkarna ligger o så, div lagrena har jag ett stylesheat som positionerar ut dem.
scriptet är kanske lite stort, men det behöver funka i alla läsare...
<A onmouseover="imgOn('1');layer_hideAll();" onmouseout="imgOff('1')" href="#">
<IMG src="images/menu_sv_1_off.gif" alt="" name="topnav_1" width="89" height="18" border=0></A>
<A onmouseover="imgOn('2');layer_Show('2');" onmouseout="imgOff('2')" href="#">
<IMG src="images/menu_sv_2_off.gif" alt="" name="topnav_2" width="58" height="18" border=0></A>
<A onmouseover="imgOn('3');layer_Show('3');" onmouseout="imgOff('3')" href="#">
<IMG src="images/menu_sv_3_off.gif" alt="" name="topnav_3" width="92" height="18" border=0></A>
<A onmouseover="imgOn('4');layer_Show('4');" onmouseout="imgOff('4')" href="#">
<IMG src="images/menu_sv_4_off.gif" alt="" name="topnav_4" width="95" height="18" border=0></A>
<div id="subnav_2" class="subnav_2"> <a onmouseover="mImgOn_D2('2','1');" onmouseout="mImgOff_D2('2','1')" href="#"><IMG src="images/menu_sv_2_1_off.gif" alt="" name="subnav_2_1" width="156" height="21" border=0></A><br>
<a onmouseover="mImgOn_D2('2','2');" onmouseout="mImgOff_D2('2','2')" href="#"><IMG src="images/menu_sv_2_2_off.gif" alt="" name="subnav_2_2" width="156" height="21" border=0></A><br>
<a onmouseover="mImgOn_D2('2','3');" onmouseout="mImgOff_D2('2','3')" href="#"><IMG src="images/menu_sv_2_3_off.gif" alt="" name="subnav_2_3" width="156" height="21" border=0></A>
</div>
<div id="subnav_3" class="subnav_3"> <a onmouseover="mImgOn_D3('3','1');" onmouseout="mImgOff_D3('3','1')" href="#"><IMG src="images/menu_sv_3_1_off.gif" alt="" name="subnav_3_1" width="90" height="21" border=0></A><br>
<a onmouseover="mImgOn_D3('3','2');" onmouseout="mImgOff_D3('3','2')" href="#"><IMG src="images/menu_sv_3_2_off.gif" alt="" name="subnav_3_2" width="90" height="22" border=0></A><br>
<a onmouseover="mImgOn_D3('3','3');" onmouseout="mImgOff_D3('3','3')" href="#"><IMG src="images/menu_sv_3_3_off.gif" alt="" name="subnav_3_3" width="90" height="20" border=0></A>
</div>
<div id="subnav_4" class="subnav_4"> <a onmouseover="mImgOn_D4('4','1');" onmouseout="mImgOff_D4('4','1')" href="#"><IMG src="images/menu_sv_4_1_off.gif" alt="" name="subnav_4_1" width="112" height="21" border=0></A><br>
<a onmouseover="mImgOn_D4('4','2');" onmouseout="mImgOff_D4('4','2')" href="#"><IMG src="images/menu_sv_4_2_off.gif" alt="" name="subnav_4_2" width="112" height="22" border=0></A><br>
<a onmouseover="mImgOn_D4('4','3');" onmouseout="mImgOff_D4('4','3')" href="#"><IMG src="images/menu_sv_4_3_off.gif" alt="" name="subnav_4_3" width="112" height="20" border=0></A>
</div>
Sedan kommer här min javascript fil som jag inkluderar.
// kolla webbläsaren
var NS = (document.layers) ? 1 : 0;
var IE = (document.all && document.getElementById) ? 1 : 0;
var N6 = (!document.all && document.getElementById) ? 1 : 0;
var hideMenu = null;
// fixa bilderna
if(document.images){
for (i=1; i<=5; i++){
eval("topnav_"+i+"_off = new Image()");eval("topnav_"+i+"_off.src = 'images/menu_sv_"+i+"_off.gif'");
eval("topnav_"+i+"_on = new Image()");eval("topnav_"+i+"_on.src = 'images/menu_sv_"+i+"_on.gif'");
}
for (i=1; i<=3; i++){
eval("subnav_2_"+i+"_off=new Image()");eval("subnav_2_"+i+"_off.src='images/menu_sv_2_"+i+"_off.gif'");
eval("subnav_2_"+i+"_on=new Image()");eval("subnav_2_"+i+"_on.src='images/menu_sv_2_"+i+"_on.gif'");
}
for (i=1; i<=3; i++){
eval("subnav_3_"+i+"_off=new Image()");eval("subnav_3_"+i+"_off.src='images/menu_sv_3_"+i+"_off.gif'");
eval("subnav_3_"+i+"_on=new Image()");eval("subnav_3_"+i+"_on.src='images/menu_sv_3_"+i+"_on.gif'");
}
for (i=1; i<=4; i++){
eval("subnav_4_"+i+"_off=new Image()");eval("subnav_4_"+i+"_off.src='images/menu_sv_4_"+i+"_off.gif'");
eval("subnav_4_"+i+"_on=new Image()");eval("subnav_4_"+i+"_on.src='images/menu_sv_4_"+i+"_on.gif'");
}
}
// rollover för bilden
function imgOn(Num) {
layer_hideAll();
if (document.images) {
document.images["topnav_" +Num].src = eval("topnav_" +Num+ "_on.src")
}
}
function imgOff(Num) {
if (document.images) {
document.images["topnav_" +Num].src = eval("topnav_" +Num+ "_off.src")
}
}
function layer_hideAll(){
layer_Hide('2');
layer_Hide('3');
layer_Hide('4');
}
// göm lager
function layer_Hide(div){
if(IE)eval('document.all.subnav_'+div+'.style.visibility="hidden"');
if(NS)eval('document.subnav_'+div+'.visibility="hidden"');
if(N6) {
switch (div){
case "2":
layer_elm = document.getElementById('subnav_2');
break;
case "4":
layer_elm = document.getElementById('subnav_4');
break;
}
layer_elm.style.visibility = "hidden";
}
}
// visa lager
function layer_Show(div){
if(IE)eval('document.all.subnav_'+div+'.style.visibility="visible"');
if(NS)eval('document.subnav_'+div+'.visibility="visible"');
if(N6) {
switch (div){
case "2":
layer_elm = document.getElementById('subnav_2');
break;
case "4":
layer_elm = document.getElementById('subnav_4');
break;
}
layer_elm.style.visibility = "visible";
}
}
//MenuMouseOver for div2
function mImgOn_D2(divNum,Num) {
clearTimeout(hideMenu);
if (document.images) {
if(IE){
document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
if(NS){
document.subnav_2.document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
if(N6){
img2 = document.getElementById("subnav_2").getElementsByTagName("IMG");
img2[Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
}
}
function mImgOff_D2(divNum,Num) {
if (document.images) {
if(IE){
document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
if(NS){
document.subnav_2.document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
if(N6){
img2 = document.getElementById("subnav_2").getElementsByTagName("IMG");
img2[Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
}
}
//MenuMouseOver for div3
function mImgOn_D3(divNum,Num) {
clearTimeout(hideMenu);
if (document.images) {
if(IE){
document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
if(NS){
document.subnav_3.document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
if(N6){
img3 = document.getElementById("subnav_3").getElementsByTagName("IMG");
img3[Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
}
}
function mImgOff_D3(divNum,Num) {
if (document.images) {
if(IE){
document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
if(NS){
document.subnav_3.document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
if(N6){
img3 = document.getElementById("subnav_3").getElementsByTagName("IMG");
img3[Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
}
}
//MenuMouseOver for div4
function mImgOn_D4(divNum,Num) {
clearTimeout(hideMenu);
if (document.images) {
if(IE){
document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
if(NS){
document.subnav_4.document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
if(N6){
img4 = document.getElementById("subnav_4").getElementsByTagName("IMG");
img4[Num].src = eval("subnav_" +divNum+ "_" +Num+ "_on.src")
}
}
}
function mImgOff_D4(divNum,Num) {
if (document.images) {
if(IE){
document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
if(NS){
document.subnav_4.document.images["subnav_" +divNum+ "_" +Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
if(N6){
img4 = document.getElementById("subnav_4").getElementsByTagName("IMG");
img4[Num].src = eval("subnav_" +divNum+ "_" +Num+ "_off.src")
}
}
}
som sagt va så blir det lite mycket 
ingen som kan hjälpa en med tanke gångar o sådant då,
hur skall jag tänka osv... måste få detta o funka ju 
Du kanske kan titta hur dom gjort här:
http://www.dhtmlcentral.com/projects/coolmenus/examples/menu1.html
löste det efter mycket om o men...
en länk blir såhär
<a onmouseover="mImgOn_D4('4','3');" onmouseout="mImgOff_D4('4','3');timeMeny()" onclick="layer_hideAll()" href="arrangemang.asp" target="bodyMain">länk</a>
sedan i min inkluderade javascript fil lade jag till
// göm lager efter musen försvinner
function timeMeny(){
hideMenu = setTimeout('layer_hideAll()',50)
}
vet inte hur säkert det är, men det funkar på de flesta browsers tror jag.