✔ 3 Button Menü erstellen

[kastalonien]

Ich weiß, das Thema wurde schon hundertmal durchgekaut, eine befriedigende Lösung habe ich trotzdem nicht gefunden.

Ich habe so gut wie keine Ahnung von Java Script aber die Sache dürfte eigentlich nicht so schwer sein.

Ich möchte ein Menü erstellen mit 3 verschiedenen Grafiken: ein Button_normal, ein Button_mouseover, und ein Button_aktiv. Das Button soll bei anklicken so lange auf aktiv bleiben, bis man im Menü auf ein anderes Button klickt. Wie kann man das am einfachsten realisieren?

Danke für Antworten

Kastalonien

 

[Sven Mintel]

Was war denn an den 100 bisherigen Lösungen unbefriedigend?

Egal...Skript#101

<script type="text/javascript">
<!--
clicked=false;
function btn_init()
{
  pattern=/(normal|hover|active)\./i;
  btns = document.getElementsByName('btn');
  for(b=0;b<btns.length;++b)
    {
      btns[b].onmouseover=function()
        {
          if(clicked!=this)
            {
              this.src=this.src.replace(pattern,'hover.');
            }
        }
      btns[b].onmouseout=function()
        {
          if(clicked!=this)
            {
              this.src=this.src.replace(pattern,'normal.');
            }
        }
      btns[b].onclick=function()
        {
              if(clicked)
                {
                  clicked.src = clicked.src.replace(pattern,'normal.');
                }
              this.src=this.src.replace(pattern,'active.');
              clicked=this;
        }
    }
}
window.onload = btn_init;
//-->
</script>

Was du ansonsten noch tun musst:
Gebe allen Buttons den Namen "btn".

Die Benennung der Grafiken muss nach folgendem Schema erfolgen:
dateiname_normal.gif
dateiname_hover.gif
dateiname_active.gif

(kann natürlich auch jpg oder png sein).

Das wars schon.... Test

 

[kastalonien]

Schonmal vielen dank für deine hilfe, alle anderen scripte haben bei mir nicht funktioniert oder nur beim mouseover oder nur bei active...

habe jetzt nur noch ein Problem: Das Laden der Grafiken dauert beim mouseover und beim active Status zu lange...wie kann ich in das Script jetzt noch ne funktion einbauen, das er die Grafiken schon preloaded ?

Danke für Hilfe

Kastalonien

 

[Dennis Wronka]

Die Suche nach dem Begriff Preloader sollte in diesem Forum eine quasi unglaubliche Anzahl an Threads liefern.

 

[Maik]

Beispielsweise so:

// Image-Preloader
image1 = new Image();
image1.src = "dateiname_normal.gif";
image2 = new Image();
image2.src = "dateiname_hover.gif";
image3 = new Image();
image3.src = "dateiname_active.gif";

 

[kastalonien]

Mit:

image1 = new Image();
image1.src = "dateiname_normal.gif";

hab' ich's ja probiert, geht aber nicht...

 

[Maik]

Heißen die Grafiken auch dateiname_... und handelt es sich hierbei um GIF-Grafiken?

Stimmt der Verzeichnispfad zu den Grafiken?

 

[kastalonien]

die heißen "Dateiname_", sind aber jpgs...verzeichnispfad stimmt auch...

 

[Maik]

Na bitte, da haben wir doch die Fehlerquellen entdeckt

image1 = new Image();
image1.src = "Dateiname_normal.jpg";
// usw.

 

[kastalonien]

das heißt, es müssen auf jeden Fall GIF-Dateien sein? JPGs gehen nicht?