Meike: Wie kann ich mein Slide-Menu modifizieren ?

Beitrag lesen

Hallo Brettgemeinde !

Ich habe ein schönes Slide-Menu gefunden und habe es nach meinen Layout angepasst, nur gefällt es mir nicht wie ich die Menu-Punkte auswählen kann.

Ich muß jedes Mal mit der Maus auf ein Menupunkt klicken, danach fährt das Menu runter und ich kann die Unterpunkte sehen & benutzen. Um da Menu zu schließen, muß ich wiederrum auf dem Menupunkt klicken und das stört mich daran. Ich habe es schon mit MouseOver versucht, aber leider gibt es da irgendwelche Probleme, weil es sich um ein BIld handelt. Hat jemand von Euch eine Idee ???

Anbei der SOurcE:

------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Menu</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<META HTTP-EQUIV="expires" CONTENT="Wed, 01 Jan 1997 00:01:00 GMT">
<META NAME="pragma" CONTENT="no-cache">
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
</head>

<SCRIPT language=JavaScript>

var menu1left=10
var menu2left=93
var menu3left=176
var menu4left=259
var menu5left=342
var menu6left=425

var menutop=-95

var pace=13

var vorzeimenu1=-1
var vorzeimenu2=-1
var vorzeimenu3=-1
var vorzeimenu4=-1
var vorzeimenu5=-1
var vorzeimenu6=-1

var step
var direction
var pause=25

var thismenu
var vorzeichen=1

var menuismoving="no"

function inite() {
 if (document.layers) {
        document.menu1.left=menu1left
        document.menu2.left=menu2left
        document.menu3.left=menu3left
        document.menu4.left=menu4left
        document.menu5.left=menu5left
        document.menu6.left=menu6left
        document.menu1.top=menutop
        document.menu2.top=menutop
        document.menu3.top=menutop
 document.menu4.top=menutop
 document.menu5.top=menutop
 document.menu6.top=menutop
 }
 if (document.all) {
        document.all.menu1.style.posLeft=menu1left
        document.all.menu2.style.posLeft=menu2left
        document.all.menu3.style.posLeft=menu3left
        document.all.menu4.style.posLeft=menu4left
        document.all.menu5.style.posLeft=menu5left
        document.all.menu6.style.posLeft=menu6left
        document.all.menu1.style.posTop=menutop
        document.all.menu2.style.posTop=menutop
        document.all.menu3.style.posTop=menutop
 document.all.menu4.style.posTop=menutop
 document.all.menu5.style.posTop=menutop
 document.all.menu6.style.posTop=menutop
 }
}

function getmenuname(clickedmenu) {
    if (menuismoving=="no") {
     if (document.layers) {
            thismenu=eval("document."+clickedmenu)
     }
     if (document.all) {
            thismenu=eval("document.all."+clickedmenu+".style")
     }
        step=pace
        checkdirection()
     movemenu()
    }
}

function checkdirection() {
 if (document.layers) {
        if (thismenu==document.menu1){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
        if (thismenu==document.menu2){vorzeimenu2=vorzeimenu2*-1;vorzeichen=vorzeimenu2}
        if (thismenu==document.menu3){vorzeimenu3=vorzeimenu3*-1;vorzeichen=vorzeimenu3}
 if (thismenu==document.menu4){vorzeimenu4=vorzeimenu4*-1;vorzeichen=vorzeimenu4}
 if (thismenu==document.menu5){vorzeimenu5=vorzeimenu5*-1;vorzeichen=vorzeimenu5}
 if (thismenu==document.menu6){vorzeimenu6=vorzeimenu6*-1;vorzeichen=vorzeimenu6}
 }
 if (document.all) {
        if (thismenu==document.all.menu1.style){vorzeimenu1=vorzeimenu1*-1;vorzeichen=vorzeimenu1}
        if (thismenu==document.all.menu2.style){vorzeimenu2=vorzeimenu2*-1;vorzeichen=vorzeimenu2}
        if (thismenu==document.all.menu3.style){vorzeimenu3=vorzeimenu3*-1;vorzeichen=vorzeimenu3}
 if (thismenu==document.all.menu4.style){vorzeimenu4=vorzeimenu4*-1;vorzeichen=vorzeimenu4}
 if (thismenu==document.all.menu5.style){vorzeimenu5=vorzeimenu5*-1;vorzeichen=vorzeimenu5}
 if (thismenu==document.all.menu6.style){vorzeimenu6=vorzeimenu6*-1;vorzeichen=vorzeimenu6}
 }
    menuismoving="yes"
}

function movemenu() {
 if (document.layers) {
        if (step>=0) {
            thismenu.top+=step*vorzeichen
            step--
            var movetimer=setTimeout("movemenu()",pause)
     }
        else {
            menuismoving="no"
            clearTimeout(movetimer)
        }
 }
 if (document.all) {
        if (step>=0) {
            thismenu.posTop+=step*vorzeichen
            step--
            var movetimer=setTimeout("movemenu()",pause)
     }
        else {
            menuismoving="no"
            clearTimeout(movetimer)
        }
    }
}

</SCRIPT>

<STYLE type=text/css>.menu {
 LEFT: -1000px; POSITION: absolute

}
</STYLE>

<META content="MSHTML 5.50.4522.1800" name=GENERATOR></HEAD>
<BODY bgColor=#ffffff  onload=inite()>
<DIV style="LEFT: 10px; POSITION: absolute; TOP: 40px">
<a href="seite.htm" target=mainFrame><IMG src="image/bild.gif" border=0></a>
 </DIV>
<!--
Konfiguration Slider 1 Wir über uns
-->

<DIV class=menu id=menu1><IMG src="image/navtopslider1.gif" useMap=#men1
border=0> <MAP name=men1><AREA shape=RECT coords=0,100,77,118 onMouseover="getmenuname('menu1')" onMouseout="getmenuname('menu1')">
<AREA shape=RECT target=mainFrame coords=18,7,60,15 href="wir_ueber_uns/anschrift.htm" title="Anschrift">
<AREA shape=RECT target=mainFrame coords=6,20,76,30 href="wir_ueber_uns/oeffnungszeiten.htm" title="&Ouml;ffnungszeiten">
<AREA shape=RECT target=mainFrame coords=10,35,68,45 href="wir_ueber_uns/rufnummern.htm" title="Rufnummer">
<AREA shape=RECT target=mainFrame coords=10,50,69,59 href="wir_ueber_uns/team.htm" title="Ihr STC-Team">
<AREA shape=RECT target=mainFrame coords=16,64,59,72 href="wir_ueber_uns/showtime/around.html" title="Blick ins STC">
</MAP></DIV>
<!--
Konfiguration Slider 2 Reisemittel
-->

<DIV class=menu id=menu2><IMG src="image/navtopslider2.gif" useMap=#men2
border=0> <MAP name=men2><AREA shape=RECT coords=0,100,77,118
  href="javascript:getmenuname('menu2')">

<AREA shape=RECT target=mainFrame  coords=29,7,51,14 href="reisemittel/stn.htm" title="STN">
<AREA shape=RECT target=mainFrame  coords=20,20,67,26 href="reisemittel/bestellinfo.htm" title="Bestellinformation">
<AREA shape=RECT target=mainFrame  coords=11,32,76,40 href="reisemittel/bahn.htm" title="Information zur Bahnbuchung">
<AREA shape=RECT target=mainFrame  coords=10,44,75,53 href="reisemittel/hotel.htm" title="Information zur Hotelbuchung">
<AREA shape=RECT target=mainFrame  coords=17,58,63,67 href="reisemittel/rueckerstattung.htm" title="Information zur Erstattung">
<AREA shape=RECT target=mainFrame  coords=16,72,64,81 href="reisemittel/zustellung.htm" title="Information zur Zustellung">
<AREA shape=RECT target=mainFrame  coords=6,85,75,90 href="reisemittel/service_hot.htm" title="Service Hotline">

</MAP></DIV>

<!--
Konfiguration Slider 3 ÖPNV Info
-->

<DIV class=menu id=menu3><IMG src="image/navtopslider3.gif" useMap=#men3
border=0> <MAP name=men3><AREA target=mainFrame shape=RECT coords=0,100,77,118
  href="oepnv_info/oepnv_info.htm" title="&Ouml;PNV-Info"></MAP></DIV>
<!--
Konfiguration Slider 4 Airport Info
-->
<DIV class=menu id=menu4><IMG src="image/navtopslider4.gif" useMap=#men4
border=0> <MAP name=men4><AREA shape=RECT target=mainFrame coords=0,100,77,118
  href="airport_info/airport_info.htm" title="Airport-Info"></MAP></DIV>
<!--
Konfiguration Slider 3 Privatreisen
-->

<DIV class=menu id=menu5><IMG src="image/navtopslider5.gif" useMap=#men5
border=0> <MAP name=men5><AREA shape=RECT coords=0,100,77,118
  href="javascript:getmenuname('menu5')">
<AREA shape=RECT target=mainFrame  coords=20,21,59,31 href="privatreisen/anschrift_tif.htm" title="Anschrift Touristik">
<AREA shape=RECT target=mainFrame  coords=10,43,73,49 href="privatreisen/buchungsinfo_tif.htm" title="Buchungsinformation Touristik">
</MAP></DIV>

</BODY></HTML>
---------

Vielen Dank

Gruß

Meike